---
title: "Favicon"
description: "A favicon is the small icon that identifies a website in browser tabs, bookmarks and mobile search results. Learn how to add one and which formats to use."
url: "https://nodea.io/en/glossary/favicon"
lang: "en"
updated: "2026-07-13"
---

# Favicon

> A favicon is the small icon representing a website, shown in the browser tab, in the bookmark list and next to results in mobile search.

A **favicon** (from *favorite icon*) is the small icon that identifies a website, displayed in the browser tab, in the bookmark list, in history and — on mobile devices — next to Google search results. It is usually a logo or a simplified brand symbol in a square format. Although a favicon occupies only a handful of pixels, it plays an important visual role: it helps users quickly locate a site among many open tabs and reinforces brand recognition.

## How a favicon works

When loading a page, the browser looks for a reference to the icon in the [HTML](https://nodea.io/en/glossary/html) code — a **\<link rel="icon"\>** tag placed in the **\<head\>** section points to the icon file. If no such reference exists, the browser falls back to requesting a **favicon.ico** file from the site's root directory. Modern sites declare several icon variants in different sizes and formats so the icon looks sharp on screens of varying pixel density.

### File formats

Historically favicons were saved in the ICO format, which packs several resolutions into one file. Today [PNG](https://nodea.io/en/glossary/png) is widely used for crisp icons, along with [SVG](https://nodea.io/en/glossary/svg), which scales without loss and can even respond to the browser's dark mode.

## Practical applications

A correctly configured favicon is part of consistent [branding](https://nodea.io/en/glossary/branding) and a foundation of a professional site image. Content management systems such as WordPress let you upload the icon from the admin panel, while a manual setup simply requires placing the file on the server and adding the right tags to the template. The favicon is also used as the shortcut icon when a site is added to a phone's home screen and in PWA apps, where — together with the manifest — it creates a native, app-like experience.

### What format and size should a favicon be?

Classically an ICO file at 16×16 and 32×32 pixels is used, but modern sites also add PNG and SVG variants for high-resolution screens. It is worth preparing larger versions (for example 180×180 px) for home-screen shortcut icons on mobile devices.

### Does a favicon matter for SEO?

Indirectly, yes. A favicon is not a direct ranking factor, but Google displays it next to results in mobile search. A recognisable icon builds trust and can improve click-through rate (CTR).

## Related

- [PNG](https://nodea.io/en/glossary/png)
- [SVG](https://nodea.io/en/glossary/svg)
- [SEO](https://nodea.io/en/glossary/seo)
- [Branding](https://nodea.io/en/glossary/branding)
- [HTML](https://nodea.io/en/glossary/html)

---

Languages: [pl](https://nodea.pl/pl/slownik-pojec/favicon.md)  
Site index: [llms.txt](https://nodea.io/en/llms.txt)