Favicon Generator — Make Favicons from Text or an Image
Drop an image or click to upload
PNG, JPG, SVG, or WebP — a square logo works best
Shape
Live preview
Paste this into your <head>
<link rel="icon" href="/favicon.ico" sizes="any"> <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png"> <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png"> <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png"> <link rel="manifest" href="/site.webmanifest">
Type a couple of letters or upload an image and get a complete favicon set in one download — favicon.ico plus PNGs from 16×16 to 512×512, an Apple touch icon, a web app manifest, and the exact HTML to paste into your page's head. Everything is drawn in your browser, so nothing is uploaded anywhere.
How it works
- 1 Choose text or an image Switch to the Text tab and type up to two letters, or switch to Image and drop in a logo (PNG, JPG, SVG, or WebP). A square source works best.
- 2 Pick a colour and shape Set a background colour for text mode and choose square, rounded, or circle corners. The live preview updates as you go.
- 3 Download and install Click Download favicon package to get a zip of every size plus favicon.ico. Unzip it into your site root and paste the HTML snippet into your <head>.
Your data stays private
All processing happens entirely in your browser. No files, text, or data are ever sent to our servers. You can disconnect from the internet and this tool will still work.
Frequently asked questions
- What sizes does the favicon generator create?
- PNGs at 16×16, 32×32, 48×48, 64×64, 96×96, 128×128, 180×180 (Apple touch icon), 192×192 and 512×512 (Android/PWA), plus 256×256 — and a multi-resolution favicon.ico containing 16, 32, and 48 pixel versions.
- Do I still need a favicon.ico if I have PNGs?
- Yes, it's the safest default. Older browsers and many feed readers, bookmarking tools, and crawlers look for /favicon.ico first. The package includes one so every client is covered.
- Is my image uploaded to a server?
- No. The image is read and rendered with the HTML canvas inside your browser. It never leaves your device — you can even generate favicons offline once the page has loaded.
- Where do I put the files and the code?
- Unzip everything into the root folder of your website (the same place as your homepage), then paste the five-line snippet into the <head> of your HTML. Clear the browser cache if the old icon lingers.
- Why do I only see the first two letters?
- A favicon is tiny — often 16 pixels wide — so only one or two characters stay legible. The generator takes the initials of what you type: 'belun.app' becomes BA, 'Acme' becomes AC.