Hero images are the web’s prettiest dead weight—slow, vague, and visually overused. It’s time to stop decorating your homepage and start saying something that actually matters.
Stop Using Hero Images! They’re Killing Your UX Read More »
KelpUI is new library that Chris Ferdinandi is developing, designed to leverage newer CSS features and Web Components. I’ve enjoyed following Chris as he’s published an ongoing series of articles detailing his thought process behind the library, getting deep into his approach. You really get a clear picture of his strategy and I love it.
Chrome 137 shipped the if() CSS function, so it’s totally possible we’ll see other browsers implement it, though it’s tough to know exactly when. Whatever the case, if() enables us to use values conditionally, which we can already do with queries and other functions (e.g., media queries and the light-dark() function), so I’m sure you’re
Poking at the CSS if() Function a Little More: Conditional Color Theming Read More »
Tired of watching the loading spinner do its little dance of despair? This brutally honest breakup letter to everyone’s least favorite UI element calls out the lies, the stalling, and the silent screams behind every infinite loop. If you’ve ever stared at a spinning circle and questioned your life choices, this one’s for you.
Dear Loading Spinner, We Need to Talk Read More »
A few years ago, my mum, who is in her 80s and not tech-savvy, almost got scammed. She received an email from what appeared to be her bank. It looked convincing, with a professional logo, clean formatting, and no obvious typos. The message said there was a suspicious charge on her account and presented a
Can Good UX Protect Older Users From Digital Scams? Read More »
We’ve known it for a few weeks now, but the CSS if() function officially shipped in Chrome 137 version. It’s really fast development for a feature that the CSSWG resolved to add less than a year ago. We can typically expect this sort of thing — especially one that is unlike anything we currently have
Lightly Poking at the CSS if() Function in Chrome 137 Read More »
In a previous article, I showed you how to refactor the Resize Observer API into something way simpler to use: // From this const observer = new ResizeObserver(observerFn) function observerFn (entries) { for (let entry of entries) { // Do something with each entry } } const element = document.querySelector(‘#some-element’) observer.observe(element); // To this const
A Better API for the Intersection and Mutation Observers Read More »
Reddit is considering using Sam Altman’s **eyeball-scanning Orb** to verify users—yes, your actual iris, for internet points. If this goes through, proving you’re human online might soon require biometric proof. Welcome to the internet’s weirdest identity crisis yet.
Reddit may soon ask: “Mind if I scan your eye? Read More »
In the first part of decoding the SVG path pair, we mostly dealt with converting things from semantic tags (line, polyline, polygon) into the path command syntax, but the path element didn’t really offer us any new shape options. This will change in this article as we’re learning how to draw curves and arcs, which
Decoding The SVG path Element: Curve And Arc Commands Read More »
I have had the opportunity to edit over a lot of the new color entries coming to the CSS-Tricks Almanac. We’ve already published several with more on the way, including a complete guide on color functions: color() hsl() lab() lch() oklab() oklch() rgb() And I must admit: I didn’t know a lot about color in
Color Everything in CSS Read More »
