Very nice solution!

Definitely very low resolution, but compared to sites that use a solid color this seems much better. And only requiring one variable is really nice.

The article seems very well thought through. Though for both the algorithm and the benchmark algorithm the half blue / half green image with the lake shows the limitations of this technique. Still pretty good considering how light weight it is.

Cool hack, but performance is terrible. That page makes scrolling on my phone laggy.

I read the title as “Minimal CSS — only blurry image placeholders” first by mistake. ;)

My attempt at the four color approach:

https://0x0.st/820Q.html

No one remembers the lowsrc img attribute.

This works significantly better than I would have expected. I was just exploring extremely simple png strings as an alternative to the hash libraries requiring decoding. I had also explored two color css gradient, based on pregenerated major/minor colors, but too course to be useful (for a fast scrolling gallery). I’ll give this a test drive!

Amazing work! Thanks you for sharing!

Man, it's wild how much you can do with CSS calculations. How long before someone makes a CSS-only Game Boy emulator?

It's a cool solution, and I like that it's CSS only. But the generated placeholders are way too blurry/lossy for my personal preferences.

Love the website and article! Looks like even with CSS there's always new things to learn and do, good stuff.