Favicon Generator

Runs in your browserImage Tools#Web

Make favicon.ico, Apple and Android icons and a web manifest from a logo, a letter or an emoji.

Make the icon from

Shape

Background

iPhone icon background

iPhones show transparent areas as black, so the Apple icon gets this colour.

Padding (0%)

Rounded corners (0%)

Site name (for the manifest)

Upload a logo to see your favicons here, or choose Text or emoji to make one from a letter.

How to use, limits & privacy

About Favicon Generator

Make a complete favicon set for a website from a logo, a letter or an emoji: favicon.ico, an SVG icon when you start from SVG, the Apple touch icon, Android icons and the web manifest, with the HTML to paste. Adjust the padding, background and rounded corners and preview the icon in light and dark browser tabs. Runs in your browser.

How to Use

Choose a source

Upload a logo under Image (SVG, PNG, JPG or WebP), or choose "Text or emoji" and type one or two letters or an emoji.

Adjust the look

Pick Fit whole image or Crop to square, a transparent or coloured background, padding and rounded corners. The tab previews and sizes update as you go.

Download and add to your site

Click Download ZIP, put the files in your site's root folder, then click Copy HTML and paste the tags into the <head> of your pages.

Privacy & Processing

Mode: local
Files Leave Browser: Local tool processing; review details below
Max Input Size: Device memory limits
Account Required: No
Data Stored Locally: Nothing is saved. Your image and settings stay in memory only while this page is open.
Network Processing: Assets or models may require an initial download

Icons are created in your browser. Nothing is uploaded.

Rules & Limitations

favicon.ico holds 16, 32 and 48 px PNG images, which every current browser reads.
favicon.svg is only included when you upload an SVG.
The Apple touch icon always gets a solid background, because iPhones show transparent areas as black.
Very detailed logos are hard to read at 16 px; a simple mark or a letter works best.

Top Suggestions

Adding an icon to a new website, blog or online shop
Making a quick letter or emoji favicon for a project
Creating the home-screen icons for an installable web app
Replacing an old favicon.ico with a full modern set

Favicon Generator FAQ

What favicon sizes do I need?

A favicon.ico with 16, 32 and 48 px, an SVG if you have one, a 180 × 180 apple-touch-icon.png and 192 and 512 px PNGs listed in a web manifest. This tool makes all of these in one ZIP.

How do I add a favicon to my website?

Upload the files from the ZIP to your site's root folder, next to index.html. Then paste the HTML tags from this page into the <head> of every page. Browsers cache favicons, so a hard refresh may be needed to see the change.

Can I make a favicon from an emoji or a letter?

Yes. Choose "Text or emoji", type up to a few characters and pick the font, colours and corners. Emoji look as they do on your device, so they can differ slightly on other systems.

Is my logo uploaded?

No. The icons are drawn and packed into the ZIP in your browser, so your logo never leaves your device.

What is the difference between favicon.ico and an apple-touch-icon?

favicon.ico is the small icon browsers show in tabs and bookmarks. The apple-touch-icon is a larger 180 px image used when someone adds your site to an iPhone or iPad home screen.