Skip to content

Favicon Generator

Drop a logo and download a complete favicon package — a multi-size favicon.ico, crisp PNG icons, an Apple touch icon and a web manifest, plus a paste-ready <link> snippet. Free, private, and made in your browser.

A whole favicon set, not just one icon

A single 256-pixel icon that the browser shrinks on the fly to 16 px looks muddy. Lumisphere builds a purpose-made bitmap for every size — 16, 32 and 48 px packed into a multi-size favicon.ico, standalone PNGs, a 180 px Apple touch icon (flattened on white, the way iOS wants) and 192/512 px icons for Android — wrapped in a .zip with a site.webmanifest and a ready-to-paste <link> snippet. Everything is generated in your browser with the native Canvas API, so your logo is never uploaded.

  1. 1Add. Drop, paste or browse for a square logo (PNG or SVG).
  2. 2Preview. See it rendered crisp at 16, 32, 48 and 180 px.
  3. 3Download. Save the package and paste the <link> snippet into your <head>.

Just need a single icon? Use the PNG to ICO converter. Need a transparent logo first? Try the background remover or the image converter — all private and in-browser.

Good to know

How do I make a favicon?

Drop a square logo (PNG or SVG, ideally 512 px or larger), then download the favicon package. It holds a multi-size favicon.ico, PNG icons, an Apple touch icon and a site.webmanifest — put them in your site root and paste the <link> snippet into your HTML <head>.

What favicon sizes do I need?

The essentials are 16, 32 and 48 px (inside favicon.ico), a 180 px Apple touch icon for iOS, and 192 + 512 px for Android home screens and PWAs. Lumisphere generates every one of them so you don’t have to guess.

What image should I use for a favicon?

A square, high-contrast logo works best — simple shapes stay legible shrunk to 16 px. Use at least 512 px so the large icons stay sharp; the live preview shows exactly how it reads at each size. A non-square image is centred on a transparent square.

How do I add the favicon to my website?

Unzip the package into your site’s root folder (next to index.html), then paste the four-line <link> snippet into your HTML <head>. favicon.ico is requested automatically, so it needs no tag. The included README.txt spells out each step.

Why is my favicon blurry?

Usually because one large icon is being downscaled by the browser. The fix is a purpose-built bitmap at each size — exactly what this package contains, so 16 px is drawn as a real 16 px image instead of a shrunk 512.

Is it free and private?

Yes — no sign-up, no watermark, no limit, and your logo is rendered on your device and never uploaded.

What’s in a favicon package

A modern favicon is not one file but a small set, because each artefact answers a different request a browser or device makes. At the centre is favicon.ico — a single file that bundles the classic 16, 32 and 48 px sizes, so older browsers and the Windows taskbar always find a sharp icon. Alongside it sit standalone PNG icons (16 and 32 px, plus larger Android sizes) that newer browsers prefer for crisp, scalable rendering. The Apple touch icon is a 180 px PNG drawn for iOS, where Safari adds it to the home screen on a solid background. A web manifest lists the larger icons so a site can be installed as a progressive web app. And a paste-ready <link> snippet ties it together, telling the browser exactly where each file lives so you never guess at the markup.

How browsers choose an icon

There is no single favicon size because no single context uses one. A browser tab wants 16 or 32 px; a bookmark or history entry may pull a slightly larger one; an iOS home screen reaches for the 180 px Apple touch icon; a PWA install and the Android launcher use the 192 and 512 px manifest icons; and a Windows tile draws on another set again. That is why a lone 16 px PNG is never enough — ask it to fill a 512 px launcher slot and it turns to mush, while a high-resolution icon scaled down to a tab stays clean. Each artefact exists so the browser can pick the closest fit rather than stretch a mismatch. A quick way to check it works everywhere: deploy, then add the site to an iOS and an Android home screen and watch a desktop tab in two browsers — if all four look sharp, the package is doing its job.

Privacy & Cookies

We use cookies and similar technologies — essential ones to run the site, optional ones only with your consent. You can withdraw your choice at any time.