Skip to main content
SK Play Labs logoSK Play Labs

Favicon Generator

Turn an image into a favicon.ico and PNG set.

Runs entirely on your device — your files never leave your browser.

Drop a square image to make a favicon

A square PNG works best — SVG, JPG or WebP are fine too · drag & drop, paste, or click to browse

Runs entirely in your browser — nothing you enter is uploaded or sent to a server.

Icons come out best from a square source with a bold, simple mark — fine detail turns to mush at 16px, and a non-square image is centred with transparent padding rather than cropped. The .ico bundles 16/32/48px; the extra PNGs are for Apple and PWAs. Everything is generated in your browser and nothing is uploaded. Read our full disclaimer.

About this tool

A favicon is the little icon in a browser tab, a bookmark, or a phone home screen. Historically it's a favicon.ico file holding several sizes; today you also want a few standalone PNGs for Apple devices and progressive web apps. This tool takes one image and produces the whole set: a favicon.ico bundling 16, 32, and 48px, plus PNGs at 16 through 512, and the exact <link> tags to drop into your page's head. The .ico is assembled with our own encoder — no upload, no third-party service, all in your browser.

From logo to tab icon

Drop in a 512×512 logo, glance at the 16px preview, download favicon.ico plus apple-touch-icon.png, paste the four <link> tags — your site now has a proper icon everywhere.

How to use

  1. 1Drop in a square image — a bold, simple logo or letter works best at tiny sizes.
  2. 2Check the true-size previews to make sure it still reads at 16px.
  3. 3Download favicon.ico for the classic bundle, and any individual PNGs you need.
  4. 4Copy the HTML snippet into your site's <head>.

Features

  • One image → a multi-size favicon.ico (16, 32, 48px) built in-browser.
  • Standalone PNGs from 16 to 512px, including Apple touch and PWA sizes.
  • True-size previews so you can judge legibility before you ship.
  • A copy-paste <head> snippet with the right <link> tags.
  • Non-square images are centred with transparent padding, never stretched.

Frequently asked questions

What image should I start with?

A square image with a bold, simple mark. Fine detail and thin text vanish at 16px, so a single letter, monogram, or chunky logo reads far better than a busy illustration. 512×512 or larger gives the cleanest downscaling.

What's the difference between the .ico and the PNGs?

favicon.ico is the traditional file that bundles several sizes and works everywhere, including older browsers. The PNGs cover modern needs — apple-touch-icon.png for iOS home screens, and 192/512 for Android and installable web apps.

My image isn't square — what happens?

It's scaled to fit and centred on a transparent square, so nothing is cropped off. For the tightest-looking icon, crop it square first (our Image Cropper does that) before generating.

Is the icon built on a server?

No. The images are rasterised on a canvas and the .ico is assembled by our own encoder in your browser. Your source image is never uploaded.

More image tools

View all