Favicon Generator

Favicon Generator — Create All Required Favicon Sizes for Free in One Click

A favicon is the small icon that appears in browser tabs, bookmarks, and mobile home screen shortcuts. Getting it right requires generating the same image in eight different sizes — from the 16×16 browser tab icon all the way to the 512×512 PWA splash screen image. This generator creates all eight sizes from a single source (text, letter, or uploaded logo) and gives you the HTML snippet to add them to your site immediately.

How to use this generator

Choose Text mode to create a favicon from one or two letters (great for brand initials like "S" for Stax or "G" for Google), then pick your background colour, text colour, and corner shape — square, rounded, or circle. Or switch to Upload mode and upload your existing logo file for best results, use a square image with strong contrast that remains legible at 16 pixels. Click Generate and download individual PNG files for each size, or use the copy icon next to the HTML snippet to get all the <link> tags you need for your site's <head> section.

Which favicon sizes does every website need?

The minimum set is: 16×16 (browser tab on low-DPI screens), 32×32 (browser tab on high-DPI and Windows taskbar), 180×180 (Apple Touch Icon for iOS home screen and iPad), 192×192 (Android Chrome home screen shortcut), and 512×512 (Progressive Web App splash screen and maskable icon). The 48×48 and 64×64 sizes cover desktop applications and older browsers. Providing the complete set ensures your brand icon looks sharp on every device and operating system where users might save or bookmark your site.

Who uses this tool

Solo developers and freelancers use it when launching client websites — generating a complete favicon set in two minutes rather than opening Figma, exporting, resizing in an image editor, and repeating for eight sizes. Startup founders use it for early-stage MVPs where getting a professional-looking tab icon matters for credibility. Open-source project maintainers use it to quickly create documentation site favicons from their project's initials before designing a proper logo.

Privacy and data handling

All favicon generation happens entirely in your browser using the HTML Canvas API — your uploaded logos and generated images never leave your device and are never sent to any server.

Frequently asked questions

What favicon sizes do I need?

The minimum set is: 16×16 (browser tab), 32×32 (high-DPI tab), 180×180 (Apple Touch Icon for iOS), 192×192 (Android Chrome), and 512×512 (PWA splash screen). This generator produces all 8 common sizes including 48×48 and 128×128.

How do I add a favicon to my website?

Download the favicon PNGs and upload them to your website's root or /public folder. Then add the HTML link tags shown in the snippet below the generated icons to your <head>. The 32×32 PNG covers most browsers; add the Apple Touch and 192×192 for mobile.

Can I use my own logo favicon?

Yes. Switch to 'Upload image' mode and upload your logo file. For best results use a square image (1:1 aspect ratio) with high contrast that is legible at 16×16 pixels. The generator scales your image to all required sizes.

What shape options are available?

Square (sharp corners), Rounded (20% border-radius, iOS-style), and Circle. All shapes are rendered on canv the background colour fills only within the chosen shape, with a transparent outer area.

Do I still need a .ico file?

Modern browsers support PNG favicons directly with the <link rel='icon' type='image/png'> tag. .ico files are only required for very old browsers (Internet Explorer < 11) and some desktop applications. For most websites, PNG favicons are sufficient.