> For the complete documentation index, see [llms.txt](https://docs.webexp.dev/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.webexp.dev/drift-shopify-theme/drift-studio/theme-settings/favicon.md).

# Favicon

The icon shown in browser tabs, bookmarks, and home screen shortcuts.

## How to access

**Theme settings → Favicon**

## Settings

### Favicon

Upload a **square image, ideally 512 × 512 px**.

DRIFT generates every size a browser might ask for from that one file:

| Size       | Where it is used                                         |
| ---------- | -------------------------------------------------------- |
| 16 / 32 px | Standard and high-DPI browser tabs, bookmarks, history   |
| 48 / 96 px | Windows pinned sites, Edge, the Android Chrome tab strip |
| 180 px     | iOS and iPadOS Home Screen, Safari Favorites             |
| 192 px     | Android Home Screen shortcut                             |
| 512 px     | Progressive web app install prompt                       |

{% hint style="warning" %}
Upload something small — a 32 × 32 px file — and every size above 32 is an upscale of it, which looks blurry on Home Screen shortcuts and pinned sites. The browser tab still renders at 16–32 px no matter what you upload, but the larger sizes are what make the icon look sharp everywhere else.
{% endhint %}

## Designing a favicon that reads

A mark that looks sharp at 512 px can turn to mush at tab size. Thin strokes, small lettering, and fine detail all disappear at 16 px.

The favicons that work are a single bold glyph or shape with strong contrast against both light and dark browser chrome. If your full logo is a wordmark, use just the initial or the emblem rather than shrinking the whole thing.

{% hint style="info" %}
Your store's main header logo is **not** configured here. It lives on the [Header section](/drift-shopify-theme/drift-studio/sections-and-features/header.md), where you can upload light- and dark-mode versions and set the height.
{% endhint %}
