#28: Put Some CSS Glass in Your HTML Windows
And how we shouldn’t rely on tools as a shortcut to gain valuable experience.
Friday, July 18, 2025
Howdy fellow web nerds! After what felt like a long malaise in the world of design on the web (and in OS-level apps), it seems we're seeing renewed interest in adding real pizzazz again. Apple's certainly taking a stand now with Liquid Glass…some folks love it, some folks hate it. And sure, we'll see some crappy reimplementations of it with loads of weird and wonky CSS.
But I think the larger point here is exciting: instead of feeling constrained to the most boring iterations of "flat design" we can tastefully start to bring back layering, texture, shading, and other techniques which add organic dimensionality to our designs.
Are you a web developer? Enjoy focusing your efforts on “vanilla” tech? Make sure you don't miss another issue of That HTML Blog:
Speaking of new design aesthetics…
🔗 Clever Backdrop Filtering for Eye-catching Glass Effects
Ever since the backdrop-filter CSS property became a thing, combined with careful usage of gradients and shadowing it’s allowed web designers to make objects appear glassy to varying degrees. In recent years, we’ve even seen the rise of glassmorphism as a UI aesthetic. In this tutorial by Josh Comeau, you'll discover some clever techniques for making frosted glass effects via backdrop-filter appear more realistic.
🔗 Put Windows in Your Web App with WinBox.js
No, I’m not talking about an emulator of Microsoft Windows in your browser. I mean, you can if you really want to! 😅
I’m talking about creating actual windows as an UI construct. You see, I’ve been mulling over some basic interface concepts for a new app I’m designing, and it occurred to me it might make sense to use an old-school desktop metaphor and organize the “documents” being worked on using windows. Then of course I started to back out of the idea because building a windowing system from scratch is a whole lot of yak shaving. After all, the real value of my app is the actual unique features it provides, not the fact it displays windows.
Yet all of a sudden I wondered: maybe there’s already a good JavaScript library which can do all the heavy lifting for me? Answer: there is! Say hello to WinBox.js.
Thanks for being a That HTML Blog subscriber! 🙏🌟
Cheers,
Jared ✌️
🤔🌩️ Things that make you think: 💡😃
The promise that wasn’t kept
AI is distracting us from creating real value. While we chase speed and automation, meaningful and human-centered work is getting left behind. Is this progress?
The tools someone uses to build a kitchen are only as good as the skills of the person using them. A skilled craftsperson can probably use any old tool and produce a great result that holds up for years to come. A less experienced craftsperson who doesn’t understand the fundamental concepts of space, structure and value-based utility might be able to make a single kitchen cabinet look good to the untrained eye, only for the shelves to be at the wrong height so I can't store my stuff. The same can be said for software.
There’s nothing wrong with being inexperienced; we all have to start from somewhere. But we can’t rely on tools as a shortcut to gain valuable experience. Experience takes time to develop, and your tools are only as good as your fundamental knowledge and skills. If you skip the knowledge and skills part, and if you fail to learn about what you’re doing and the implications of how you’re doing it and the human value you have the potential to deliver, then you have little hope of building human value into your software.