Image

Favicon Generator

Generate favicons and app icons at every required size from one source image, with the exact HTML to reference them.

Favicon Generator

Create custom favicons from text or emojis instantly.

Preview (256x256)

Need this done properly for your business?

Radiatus delivers secure cloud, DevOps & compliance engineering.

Book a free consult

What you actually need in 2026

The sprawling 20-file favicon packs of a decade ago are obsolete. A modern set is three files. An SVG favicon, referenced as an icon with type image/svg+xml, which scales to any size and can adapt to dark mode using a media query inside the SVG itself. A 180 by 180 PNG as apple-touch-icon for iOS home screens, which do not support SVG. And a legacy favicon.ico at the site root containing 32 by 32, for older browsers and for tools that request the root path directly.

Add a web app manifest referencing 192 and 512 pixel PNGs if the site is installable as a progressive web app. That is the complete list.

Design for 16 pixels, not for the logo

The single most common mistake is scaling a full wordmark down to favicon size, where it becomes an unreadable smear. At 16 by 16 you have room for one letter, one simple mark, or one strong shape. Take the most distinctive element of the brand and use that alone. Test by actually viewing it at 16 pixels rather than judging the 512 pixel version.

Maskable icons get cropped

Android applies a mask to home screen icons, which can be a circle, a squircle or a rounded square depending on the launcher. An icon that fills its canvas to the edges loses its corners. The specification defines a safe zone: keep all essential content within the central 80 percent, and declare the icon with a maskable purpose in the manifest.

Dark mode

An SVG favicon can carry a prefers-color-scheme media query internally, so a dark logo can switch to a light one against a dark browser chrome. Without this, a black mark on a transparent background disappears entirely in dark mode, which is a surprisingly common oversight.

Browsers cache favicons aggressively

Favicon caching is unusually persistent and often survives a normal hard refresh, because it is stored separately from the page cache. When updating an icon, expect the old one to linger. A cache-busting query string on the link tag, or a genuinely new filename, is the reliable way to force the change.

Frequently Asked Questions

Privacy & Security

Generated locally in browser.

Data: None
Client-side-Side
Active
v1.0

About This Tool

This tool runs entirely in your browser. No data is sent to any server, ensuring complete privacy. Simply use the interface above to get started — no registration or login required.

Disclaimer: This tool is provided "as is" without warranty of any kind. Results are for educational and utility purposes.