Favicon Generator for Every Browser and Device
This favicon generator turns one image into all the favicon files a website needs — the multi-size favicon.ico, individual PNGs from 16×16 up to 512×512, an Apple Touch Icon, and a PWA manifest. Upload a logo or picture, fine-tune the look, and download a ready-to-use package.
It is built for anyone shipping a site: developers, designers, bloggers, and small-business owners who want a sharp browser-tab icon without resizing and converting each size by hand. Source formats include PNG, JPG, SVG, WebP, and GIF, and you can shape, pad, and colour the icon before exporting.
How to Create a Favicon
Upload your image
Click the upload area or drag and drop a file. PNG, JPG, SVG, WebP, and GIF are supported. For the sharpest result, use a square image at least 512×512 pixels.
Customize the look
Pick a Shape — Square, Rounded, or Circle — choose a Transparent or solid Color background, and drag the Padding slider (0–40%) to give the icon breathing room.
Preview every size
The preview grid shows your favicon at each standard size, and a browser-tab mockup shows exactly how it will look in a real tab. Everything updates instantly as you adjust the settings.
Download what you need
Grab favicon.ico (16/32/48), a single 32×32 PNG, the 180×180 Apple Touch icon, or use Download All for a ZIP with every size plus HTML and a manifest.
Features
Drag & Drop Upload
Drop an image or use the file picker. Accepts PNG, JPG, SVG, WebP, and GIF source files.
Shape Options
Choose Square for the classic favicon, Rounded for soft corners, or Circle for an app-style icon.
Background & Padding
Keep a transparent background or set a solid colour, then adjust padding from 0% to 40%.
Live Browser-Tab Mockup
See exactly how your favicon appears in a real browser tab, updating instantly as you tweak settings.
Preview at 8 Sizes
Check the icon at 16, 32, 48, 64, 128, 180, 192, and 512 pixels before you download.
ICO & PNG Output
Export favicon.ico with 16/32/48 embedded, a single 32×32 PNG, or the 180×180 Apple Touch icon.
Complete ZIP Package
Download All bundles favicon.ico, all 8 PNG sizes, ready-to-paste HTML, and a site.webmanifest.
Apple & PWA Ready
Includes the apple-touch-icon and a manifest with 192 and 512 icons for Android and PWA support.
Private & Offline
Every resize and conversion runs in your browser — images are never uploaded and nothing is tracked.
Frequently Asked Questions
What size should a favicon be?
Start from a square image of at least 512×512 pixels so even the largest output stays sharp. The browser tab icon itself is usually 16×16 and 32×32, but modern sites also use 48×48, a 180×180 Apple Touch Icon, and 192×192 / 512×512 for Android and PWA. This tool generates all of them from your single image.
How do I create a favicon.ico?
Upload your image, adjust the shape, background, and padding, then click the ICO download. The tool builds a single favicon.ico that embeds the 16×16, 32×32, and 48×48 versions, which is the classic format browsers look for at your site's root.
Can I make a favicon from a PNG or SVG?
Yes. You can upload a PNG, JPG, SVG, WebP, or GIF as the source. A high-resolution PNG or a vector SVG gives the cleanest result because it scales down to the small sizes without looking blurry. Non-square images are fitted and centred while keeping their aspect ratio.
What is the difference between ICO and PNG favicons?
ICO is the traditional favicon format that holds several sizes in one file and is supported natively by browsers. PNG favicons are individual files referenced per size with HTML link tags. For the widest compatibility, use both: a favicon.ico as the fallback plus PNGs for modern browsers — the Download All package includes them together.
How do I add a favicon to my HTML?
Place the downloaded favicon files in your website's root directory, then paste the link tags into your page's <head>. The Download All ZIP includes a favicon-usage.html file with the exact <link> tags for the icon, Apple Touch Icon, and the manifest, so you can copy them straight in.
Which shape should I choose?
Square is the standard look for most websites. Rounded adds soft corners for a modern, friendly feel, and Circle suits app-style icons, especially for a PWA or a mobile home screen. The preview grid lets you compare each shape with your logo before exporting.
Can I use a transparent background?
Yes — transparent is the default and works well for logos shown over different page backgrounds. Some platforms, such as iOS, place a white or black panel behind transparent icons, so if you are generating an Apple Touch Icon you may prefer to set a solid background colour.
No comments yet. Be the first to comment!