Where do I set the favicon in Drupal?

Under Appearance, then Settings for your active theme, in the Shortcut icon settings section. Uncheck the default option and upload your own .ico or .png, then save and clear the cache.

What favicon format does Drupal accept?

Drupal accepts .ico and .png shortcut icons. A 32x32 icon works for the tab; provide a square 512x512 source if you also generate the larger app icons separately.

Why is my Drupal favicon not updating?

Usually the render cache. Save the theme settings, then go to Configuration, then Performance and Clear all caches, and hard-refresh. Browser favicon caching can also delay the change.

How do I add Apple touch and PWA icons in Drupal?

The shortcut icon setting only covers the browser favicon. Add apple-touch-icon and manifest link tags via your theme's html.html.twig (or a metatag/PWA module) to cover iOS and Android.

All platforms

Favicon for Drupal

How to add a favicon in Drupal

To add a favicon in Drupal, go to Appearance, click Settings on your active theme, scroll to Shortcut icon settings, uncheck Use the default shortcut icon, and upload your own .ico or .png. Save the configuration and Drupal serves your favicon across the site.

What you need

A favicon file - .ico or .png (32x32 works; 512x512 source for sharpness).
Access to Appearance, then Settings for your active theme.
A custom head edit (or a module) for Apple touch and PWA icons beyond the shortcut icon.

Step-by-step: add a favicon in Drupal

Open theme settings. Go to Appearance (admin/appearance), then click Settings next to your active theme.
Open Shortcut icon settings. Scroll to the Shortcut icon settings section and uncheck Use the default shortcut icon supplied by the theme.
Upload your favicon. Use the Path to custom icon field (or the upload field) to add your own .ico or .png favicon.
Save configuration. Click Save configuration, then clear the Drupal cache (Configuration, then Performance) and hard-refresh.

Common mistakes to avoid

Leaving Use the default shortcut icon checked, so Drupal ignores your upload.
Forgetting to clear the Drupal render cache after saving, so the old icon persists.
Uploading a non-square or tiny image, which renders blurry in the tab.
Expecting Apple touch and PWA icons; the shortcut icon setting only handles the browser favicon.

Free forever, no sign-up

Generate a complete icon set for Drupal

One logo in, every file out: favicon.ico, the PNG sizes, the Apple touch icon, Android and PWA icons, a maskable icon, the web manifest, and a copy-paste snippet ready for Drupal. Free, private, and generated in your browser.

Open the generator

Frequently asked questions

Where do I set the favicon in Drupal?: Under Appearance, then Settings for your active theme, in the Shortcut icon settings section. Uncheck the default option and upload your own .ico or .png, then save and clear the cache.
What favicon format does Drupal accept?: Drupal accepts .ico and .png shortcut icons. A 32x32 icon works for the tab; provide a square 512x512 source if you also generate the larger app icons separately.
Why is my Drupal favicon not updating?: Usually the render cache. Save the theme settings, then go to Configuration, then Performance and Clear all caches, and hard-refresh. Browser favicon caching can also delay the change.
How do I add Apple touch and PWA icons in Drupal?: The shortcut icon setting only covers the browser favicon. Add apple-touch-icon and manifest link tags via your theme's html.html.twig (or a metatag/PWA module) to cover iOS and Android.

Favicon guides for other platforms

New to favicons? Read the complete favicon guide and the icon size cheatsheet, or jump straight to the favicon generator.