The smallest GIF is still useful because it is the smallest possible valid favicon. This means you can stuff it into a data: URI to prevent useless requests showing up when you are working on something:

    <link rel="icon" href="data:image/gif;base64,R0lGODlhAQABAAAAADs=">

If you're just wanting to shut the request up and aren't actually trying to display a certain favicon you can do:

  <link rel=icon href=data:>

With the bonus you've probably already remembered how to reconstruct this on demand just by reading this comment. It is "invalid" data but so is your example on Safari and Firefox instead of Chromium based browsers. It doesn't matter as much because that problem is local and silent in the logs, unlike the request.

Thanks! I’m pretty sure I tried this ages ago and it didn’t work at the time, but I tried this again now and it does the job.

The key is to keep up through "data:" since any shorter (even just dropping the ":") and it gets treated a relative link instead.

You can also make an actually useful and readable SVG favicon this way:

    <link
      rel="shortcut icon"
      href='data:image/svg+xml,%3csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">%3ccircle cx="25" cy="50" r="20"/>%3ccircle cx="75" cy="50" r="20"/>%3c/svg>'
    />

Good to know! My goal is simply to stop a 404 popping up during development in the simplest way possible, so the smallest amount of code is best for me.

A use case: https://news.ycombinator.com/s.gif (43 bytes) (use for comment indentation)

It's kinda cool than HN looks OK even in simple browsers like Dillo:

<https://imgur.com/a/Seu8rYT>

However it's pretty bad on narrow screens. I wish there was some progressive enhancement via modern CSS, or at least just dark mode.