⭐ For website and app makers

⭐ Favicon and app icon generator

Create every icon your site needs in a minute from an image, an emoji or your initials: favicon.ico, favicon.svg, Apple icon, Android and maskable icons, manifest and HTML code, ready in a ZIP file. Everything happens in your browser.

1. Your icon

Text, initials or emoji An image (PNG, JPG, WebP or SVG)

Text (1 to 3 characters recommended) Font Text colour Weight

Background colour Shape Inner margin

Transparent background for the favicon (the Apple and maskable icons always keep a solid background)

Site or app name Short name (home screen, 12 characters max.)

2. Preview

Browser tab, light and dark

Mon site

Google result

Mon sitehttps://example.com

iPhone and Android home screen

Mon site

Maskable icon and its safe zone

Android crops this icon into a circle, a squircle or a square depending on the phone: everything that matters must stay inside the dotted circle.

3. Your files

favicon.ico16, 32 and 48 pixels in one file: requested automatically by every browser and by Google.
favicon.svgVector, sharp at every size in modern browsers.
favicon-16x16.pngSmall PNG favicon.
favicon-32x32.pngPNG favicon for high-density screens.
apple-touch-icon.png180 × 180, solid background: iPhone and iPad round the corners themselves.
icon-192.pngAndroid and installable web app icon.
icon-512.pngLarge icon: splash screen of the installed app.
icon-maskable-512.pngMaskable version, with the safety margin Android expects.
site.webmanifestWeb app manifest: name, colours and icons.

Code to paste in the <head> of your pages (put the files at the root of the site)

Which icons do you really need in 2026?

No need for twenty sizes as in the past. Browsers still request /favicon.ico at the root of the site, hence this file. Modern browsers prefer a favicon.svg, sharp at every size. iPhone and iPad use the 180-pixel apple-touch-icon, without transparency. Finally, an installable web app needs at least a 192 and a 512-pixel icon in its manifest; a maskable version keeps Android from cropping your logo.

For SEO, Google shows the favicon next to your results. Its guidelines: a square icon, at least 8 pixels but preferably larger than 48 pixels, declared with a link rel icon tag on the home page, and crawlable by Google (do not block it in robots.txt). A sharp, recognisable favicon makes your result look more trustworthy.

Updated: October 2026, based on the documentation of Google Search Central, web.dev and MDN.

Sources: Google Search Central · web.dev (manifeste) · web.dev (maskable) · MDN

Frequently asked questions

Why doesn't my favicon show in Google?

Google updates favicons at its own pace, sometimes over several weeks. Check that the tag is on the home page, that the icon is square and that neither the page nor the image is blocked to crawlers. You can request a new crawl of the home page in Search Console.

Should the background be transparent?

For the favicon it is possible, but check it stays readable on a dark tab. For the Apple icon and the maskable icon, no: a solid background is required, and the tool adds it automatically.

My logo is rectangular, what should I do?

An icon must be square. The tool centres your image in the square; to stay readable at 16 pixels, use your brand's symbol or initial rather than the full logo with text.

Where do I put the files?

At the root of your site, next to the home page, then paste the code provided into the head tag of every page. On WordPress, the site icon can also be set in Appearance, Customize, Site Identity.

Handy tools, before everyone else

Join the OUFRID club: early access, free Premium and your name in the app.

Join the club