Favicon generator

Make a favicon from an image, text or emoji. Export favicon.ico, apple-touch-icon, PNG, SVG and a web manifest in one go (16, 32, 48, 180, 192 and 512px), and preview how it looks in tabs, Google Search and on an iPhone. Everything runs in your browser.

1. Create the icon

Text (1-2 characters)FontText colour

Bold

2. Adjust

Add dark-mode colours to icon.svg

3. Preview

Choose an image to see the preview.

Note: The text in icon.svg is drawn with a font on the viewer's device. If the font is missing it falls back to another one

4. Site info (manifest and tags)

Site name (manifest name)Folder where you will place the filesUse / for the site root. The URLs should stay fixed once published.theme_color

background_color

Also output a maskable 512px icon (with safe-zone padding)

5. Download

JSONfavicon.ico16, 32 and 48px in one file
JSONicon.svgFor browser tabs (not used by Google Search)
JSONicon-192.png192x192 (PNG over 48px for Google Search; Android)
JSONicon-512.png512x512 (PWA)
JSONicon-512-maskable.png512x512 maskable (with safe-zone padding, PWA)
JSONapple-touch-icon.png180x180, opaque (iPhone home screen)
JSONsite.webmanifestWeb app manifest

Tags for <head>

<link rel="icon" href="/favicon.ico" sizes="48x48">
<link rel="icon" href="/icon.svg" type="image/svg+xml">
<link rel="icon" href="/icon-192.png" type="image/png" sizes="192x192">
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
<link rel="manifest" href="/site.webmanifest">

Google Search requirements

Met: A raster image larger than 48px (icon-192.png) is declared as rel="icon"
Met: Formats are ICO and PNG (supported by Google), and all icons are square
Note: icon.svg is not used for Google Search favicons (SVG is unsupported); it is for browser tabs
To check: Keep the favicon URL stable, with one favicon per hostname (subdomains are separate)
To check: Do not block the favicon or home page from Googlebot and Googlebot-Image in robots.txt

Google Search Central: Define a favicon

Related tools