One letter · one colour · every size
A favicon that works at sixteen pixels.
Ask a chatbot and you get an SVG that falls apart in the tab. Ask a generator site and you get a zip of blurry PNGs and an ad. faviconthing makes a clean letter mark in every size a browser asks for, in one command.
Act I
The usual way.
You need a favicon for a new site. It's a sixteen-pixel square, so how hard can it be?
01 · Ask a chatbot
It writes you an SVG.
A gradient, a server stack, and the name in six-pixel type. It looks fine in the chat, at the size nobody will ever see it.
02 · Ask again
"You're absolutely right!"
It agrees it's blurry, simplifies it, and keeps the gradient. Then it mentions the other files browsers want, and says to find a converter for them.
03 · Try a generator site
A zip, a PNG, and an ad.
Upload a logo, press generate, close a newsletter popup. You get a zip of every size, each one a blurry downscale of the same picture.
04 · In the tab
Where it actually lives.
Sixteen pixels, next to every other tab you have open. Three attempts in, none of them is a letter you can read at a glance.
That was one sixteen-pixel square.
- attempts
- 3
- files still missing
- 2
- ads closed
- 1
- readable in the tab
- 0
Here's the same favicon, with faviconthing.
Act II
The faviconthing way.
A letter, a colour, and a shape. It writes every file a browser asks for, and each one is sharp at its own size.
01 · One command
Give it a letter and a colour.
It always writes a capital, sized and centred to read at sixteen pixels, on the colour you pick. Six files, and the markup that points at them.
02 · Pick the shape
Circle, square, or rounded.
White or black on whatever vibrant colour you choose. Those are the only decisions a sixteen-pixel mark needs.
03 · The whole set
One look for every thing.
Every site in this set gets its mark the same way: its first letter, on its own colour. They match each other without anyone designing nineteen icons.
04 · The markup
And the lines for your head.
It writes what points at the files too, so nothing has to be looked up or copied from a blog post.
Act III
What it writes, and why it holds up.
A favicon is a handful of files at fixed sizes. faviconthing writes all of them from one description, the same way every time.
-
1
A mark made for the size
One capital letter, bold, centred and large enough to read at sixteen pixels. No gradients, no detail that turns to mush in a tab.
-
2
Every file a browser asks for
favicon.svg, a multi-sizefavicon.ico, the Apple touch icon, the two app icons and the manifest. Each one is drawn at its own size, not scaled down from another. -
3
The same every time
Run it twice and the second run changes nothing. The letter and the colour are the whole description, so it lives in a script next to the site.
| Measure | Chatbot | Generator site | faviconthing |
|---|---|---|---|
| Readable at 16 px | no | blurry | yes |
| Every size | one SVG | a zip | six files and the markup |
| The same next time | never | if you kept the logo | always |
| Ads and popups | none | several | none |
Want the icons for your sites?
Tell me the letters and the colours. The tool lives with the rest of the things, and it's close to ready.