Favicon Studio TEXT
Design a favicon from text, emoji, an image or a built-in shape, check it in real browser and device contexts, then export a complete pack — PNGs, a true multi-size .ico, a manifest and the markup. Everything runs in your browser.
Icon source
One or two characters read best at 16 px. Up to four are allowed.
Type or paste any emoji, or pick one below. Rendering uses your system emoji font.
Design
0% square → 50% circle. Squircle smoothing gives the Apple-style corner.
Live preview
Actual pixel sizes
In context
Same icon, real surroundingsBrowser tab — light
Browser tab — dark
Bookmarks bar
Desktop shortcut
Mobile home screen
Presets
Press 1–6 to apply a preset. Applying one replaces every control, and can be undone.
Quality checks
Site details
Used in the previews, the manifest and the README inside the export pack.
Quick export
Saved designs
Save the design you are working on to come back to it later. Designs are stored in this browser and sync to your Feerebu account when you are signed in.
Recent activity
The complete pack
Built in your browser — nothing is uploadedfavicon-pack.zip
Every PNG size, a multi-resolution favicon.ico, site.webmanifest, the markup snippet and a README, packaged with a pure-JavaScript ZIP writer.
favicon.ico
A genuine multi-resolution ICO containing 16, 32 and 48 px PNG entries, written byte by byte — the file legacy browsers look for at your site root.
Markup
The link and meta tags to paste into your head, already pointing at the file names in the pack.
Individual PNGs
Pack contents
-
favicon-16.pngbrowser tab, bookmarks bar -
favicon-32.pngretina tab, Windows taskbar -
favicon-48.pngdesktop shortcut -
apple-touch-icon-180.pngiOS home screen -
android-chrome-192.pngAndroid home screen -
android-chrome-512.pngPWA splash, store listings -
favicon.ico16/32/48 multi-resolution -
site.webmanifestPWA metadata -
favicon-snippet.htmlmarkup to paste -
README.txtinstall instructions
HTML snippet
site.webmanifest
Keyboard shortcuts
Designing a favicon that works
- One idea only. At 16 px you have roughly 256 pixels. A single letter, a single shape.
- Contrast beats colour. Aim for a foreground/background contrast ratio above 4.5:1 — the quality panel computes it live.
- Check both themes. A dark icon vanishes on a dark tab strip. Use the light/dark preview surfaces.
- Avoid thin strokes. Anything under about 6% of the canvas disappears when the icon is scaled to 16 px.
- Ship the .ico. Some browsers and crawlers still request
/favicon.icoat your site root.
Your data
Designs and preferences live in this browser's local storage, so the studio works completely offline. When you are signed in to Feerebu they also sync to your account.