Generate Favicons From an Image or Text
The problem
You need a favicon for your site, but the requirements are a maze. Browsers want different sizes. Apple devices need a 180x180 touch icon. Android expects a 192x192 and 512x512 for the web app manifest. Some guides say you need an ICO file, others say PNG is fine, and newer articles recommend SVG. If you just drop a single favicon.ico in your root, half the use cases show a blurry or missing icon.
And if you are early in a project — a side project, a prototype, a hackathon — you might not even have a logo yet. You just want something that is not the default blank icon in the browser tab.
How it works
- Upload an image or type text — use your logo, or generate a quick text-based favicon with a letter or emoji.
- The tool generates all sizes — 16x16, 32x32, 48x48, 180x180 (Apple touch icon), 192x192, and 512x512.
- Download the images and copy the HTML link tags to paste into your
<head>.
Which sizes you actually need
| Size | Used by |
|---|---|
| 16x16 | Browser tabs |
| 32x32 | Browser tabs (high-DPI), taskbar, shortcuts |
| 180x180 | Apple touch icon (iOS home screen) |
| 192x192 | Android Chrome, web app manifest |
| 512x512 | PWA splash screen, app stores |
If you can only pick one, start with a 32x32 PNG as favicon.png. It covers browser tabs on both standard and high-DPI screens. Add the 180x180 Apple touch icon next — it is the most common mobile miss.
ICO vs PNG vs SVG
ICO is the legacy format. It can bundle multiple sizes in one file, but it is larger and unnecessary for modern browsers. PNG is the practical default — universally supported, small file size, and easy to generate. SVG is the newest option: a single vector file that scales to any size and supports dark mode via CSS media queries. Browser support for SVG favicons is strong but not universal, so pair it with a PNG fallback.
Text favicons for quick branding
No logo? Type a single character — a letter, a number, an emoji — and the tool renders it as a crisp favicon. This is perfect for personal blogs, dev tools, documentation sites, or early-stage projects where you want something identifiable in the browser tab without spending time on design.
Why I built it
Every project I start needs a favicon, and every time I would either skip it (leaving the ugly default) or spend too long resizing one image into five different sizes. Text favicons were the feature I wanted most — type a letter, pick a color, done.