Favicon Gallery

Roll your own

Two of the easiest favicons to make from scratch. Tweak, then copy.

One <text> element inside an SVG. Works in every modern browser.

Emoji

A letter on a shape. The workhorse favicon for side projects.

Letter Background Text

SVG favicons need no sizes. One vector scales to every tab, bookmark and retina display. Safari on macOS supports them; very old browsers fall back to /favicon.ico if you keep one around.
The # in hex colors must be encoded as %23, or the browser reads the rest of the URI as a fragment. Everything copied here is already encoded for you.
Emoji render with the visitor's font, so the same tag looks a little different on macOS, Windows and Android. That is usually fine, and occasionally charming.
Dark mode is possible. Inside an SVG favicon you can use @media (prefers-color-scheme: dark) in a <style> block. Chrome and Safari honor it; Firefox does not, yet.