Text Favicon Generator

A favicon is the tiny icon in browser tabs, bookmarks and search results. If you do not have a logo yet, one or two letters on a coloured background are a clean, recognisable choice. This generator draws your letters or emoji in the font, colours and shape you choose, and creates the full set of files sites use today: favicon.ico, an SVG favicon, the Apple touch icon, Android icons, the web app manifest and the HTML tags to paste. Everything is made in your browser.

How to use this tool

1. Type 1–3 letters (for example your initials) or one emoji.
2. Choose the font, letter size and colours, and a square, rounded or round shape.
3. Enter your site name for the manifest.
4. Download all files as a ZIP, upload them to your site's root folder and paste the HTML into the <head>.

Formula

font size = 100 px × icon size × letter size % ÷ max(text width, text height at 100 px)

The text is measured with the browser's font metrics and its visible ink box is centred on the icon, so letters with and without descenders sit in the middle. Each PNG size is drawn separately rather than shrunk from a large one. favicon.ico holds 16, 32 and 48 px PNG images. The Apple touch icon is square and opaque because iOS rounds and masks it itself.

Example

For the letter K at 65% on a 512 px icon, the letter is scaled until its taller side — the height — is 0.65 × 512 = 333 px, then centred. The 16 px tab icon gets the same proportions: the letter is about 10 px tall.