The free online favicon generator turns one image into the modern favicon set, a multi-size ICO, an SVG, an Apple touch icon and PWA icons with the HTML tags to match. Because it runs in the browser, the image is never uploaded.
Icon and favicon work by OnlinePCApps since 2013
A site without a favicon shows a blank tab, a plain bookmark and a screenshot on a home screen. The free online favicon generator builds the whole icon set from one image.
A crisp favicon marks a site in a crowded tab strip, a bookmark bar and a search history. It is the smallest piece of brand a visitor sees most often, and a blank one looks unfinished.
The modern set needs an ICO, an SVG, a 180 Apple icon and PWA icons at 192 and 512. Exporting each by hand is fiddly, so the generator writes them all from one source in a single pass.
A brand mark before a launch should not sit on an outside server for an icon export. The generator runs in the browser, so the logo stays on the device while the icons are built.
Drag a logo or a mark onto the panel above, or browse to it on the device. An SVG scales best, while a PNG or a JPG works when it is at least 512 pixels square.
Check the icon in a browser-tab mockup and a home-screen preview. A background colour, a theme colour and a little padding can be set so the mark reads clearly at a tiny size.
Download a ZIP with the ICO, the SVG, the Apple icon, the PWA icons and the site.webmanifest. A short README holds the HTML tags to paste into the head of the site.
To make a favicon is to size one image into the icons a site needs. The tool does that on the device.
A single favicon.ico is written holding the 16, 32 and 48 pixel sizes in one file, the legacy layer that older browsers and some feed readers still request. The ICO is encoded in the browser from the source image.
When the source is an SVG, a scalable favicon.svg is kept, the format modern browsers prefer and downscale on their own. A raster source produces the ICO and PNG icons instead, since an SVG needs vector art to scale.
A 180 pixel Apple touch icon is written for an iPhone or iPad home screen, kept square and opaque as Apple asks. A 192 and a 512 pixel PNG, with a padded maskable variant, cover an Android home screen and a PWA install.
A site.webmanifest lists the PWA icons with a theme and a background colour, and a README holds the four HTML link tags to paste into the head. A theme-color meta tag is added too, tinting the browser bar on a phone. The tags point at the ICO, the SVG, the Apple icon and the manifest.
To make a favicon, to generate a favicon.ico and to create app icons all name the same task. A search for favicon generator or favicon maker reaches this tool, and the source image is left as it is.
The generator sizes one image into the icon set a site needs. These points decide how the result lands.
| The case | Result | What happens and why |
|---|---|---|
| favicon.ico | 16, 32, 48 | A multi-size ICO in one file, the legacy layer older browsers still request. |
| favicon.svg | from an SVG | A scalable SVG is kept when the source is an SVG, the format modern browsers prefer. |
| Apple touch icon | 180 square | A 180 pixel PNG for a home screen, kept opaque with no pre-rounded corners. |
| PWA icons | 192 and 512 | Two PNGs for Android and a PWA install, plus a padded maskable variant. |
| site.webmanifest | PWA metadata | Lists the PWA icons with a theme colour and a background colour. |
| HTML tags | four links | Ready to paste into the head, pointing at the ICO, SVG, Apple icon and manifest. |
| Source image | 512 or an SVG | A square SVG scales best, while a raster should be at least 512 pixels. |
| Old extras | skipped | The deprecated Safari pinned-tab mask icon and the dozen loose PNGs are left out. |
| Where it runs | on the device | The icons are built in the browser, so the image is not uploaded. |
The Modern Favicon Set
The favicon set that a modern site needs is smaller than the old checklists claim. Six files cover almost every device today. A scalable favicon.svg is the one current browsers prefer and downscale on their own. A multi-size favicon.ico holds 16, 32 and 48 pixels as the legacy fallback. A 180 pixel Apple touch icon covers a home screen, while a 192 and a 512 pixel PNG feed Android and a PWA install. A site.webmanifest ties the PWA icons together with a theme and a background colour. Two honest points matter. A true scalable SVG needs an SVG source, since a photo cannot be turned into vector art, so a raster image produces the ICO and PNG icons alone. The Apple touch icon is kept square and opaque with no pre-rounded corners, because Apple rounds and masks it. A maskable PWA icon is padded so the mask does not clip the mark. The old dozen loose PNGs and the deprecated Safari pinned-tab mask icon are left out on purpose. The references below define the formats.
Both make the icons a site needs. The trade is real, and a logo is often unreleased.
| Point of comparison | This tool Built in the browser On the device | A design app Figma, Illustrator or similar |
|---|---|---|
| Where the logo goes | Stays on the device | Stays on the machine |
| Price and caps | Free with no file cap | Often a paid licence |
| Hand-tune each size | One source, scaled evenly | Pixel-hint the 16 by hand |
| Draw the mark itself | Sizes an image it is given | Designs the logo from scratch |
| The full set at once | Every file plus the tags | Each size exported by hand |
A design app wins where the artwork itself is the job, hand-tuning a 16 pixel icon or drawing the mark from nothing. This page wins where a logo already exists and the whole sized set, the manifest and the tags are wanted in one step. Both keep the logo local, and this one is free with no cap.
The image is sized and the ICO is encoded inside the browser through its built-in canvas, so the work is client-side and the logo stays on the machine that opened it. No copy is passed to a server for the job.
A brand mark before a launch is not meant to sit on an outside server, and a client logo is not always cleared for one. A hosted generator has to upload the image to size it, more exposure than an icon export is worth.
Each of these builds the icons a site needs. They differ in effort, in cost and in where the image goes.
A design app, ImageMagick and hand-coding all build a favicon, yet each exports the sizes by hand or lives in the terminal. A hosted tool uploads the logo instead. This page sizes the whole set with the manifest and tags, kept local with nothing to set up.
A little context sets a sharp result.
An SVG scales best and stays crisp at any size. A raster source should be square and at least 512 pixels, since a small or oblong image shows soft edges once it is sized down to a tab. A simple mark reads better than a full logo, because the icon often shows at 16 pixels where fine detail is lost.
The 180 pixel Apple touch icon is kept square and solid, with no transparency and no pre-rounded corners. Apple rounds and masks it on its own, so a clear background there shows a black box on a home screen. Leaving about 20 pixels of padding keeps the mark clear of the corners iOS trims.
A maskable PWA icon is cropped to a circle or a rounded square on Android. Keeping the mark inside a padded safe zone means the mask trims the edge rather than clipping the logo itself.
The browser makes a full favicon set from one image, which fits a single site. An agency running many brands, or a saved template applied across a set of sites, belongs on the desktop edition, which reads from disk and writes each set from its own source in one run.
Point it at a folder of logos and each one is sized to its own favicon set in a single run, saved beside the source.
A saved template sets the padding, the background and the theme colour once, then applies it across every brand in a kit.
Saved presets set which icons to write and the manifest fields in one click, ready for a repeated workflow.
Free and online, with no sign-up and no upload. Build the whole favicon set in the browser, all on the device.