Of all the latest and greatest CSS features, the “:has” pseudo-class wasn’t exactly at the top of my wishlist. Once I started using it, however, I kept discovering incredible things I could do with it. It’s now become a core part of my toolkit! In this blog…

Font performance optimization is a set of web development techniques that make fonts load faster and render more smoothly, including thoughtful font selection, the use of performant font formats, self-hosting, optimized @font-face declarations, font display…

Can you convert a video to pure css? Yes, yes you can. And this is how.

Learn WCs felt so sluggish on Firefox that I disabled the background animation for all users. Turns out, fixing it took changing two lines of CSS.

An exploration of the newly supported at-rule for explicitly defining and animating custom properties in CSS.

I am thrilled to say, that from this week onwards, the CSS-tricks Almanac has an entry for each property, function, and at-rule related to the new Anchor

Sticky positioning is one of those CSS features that’s pretty delicate and can be negated by a lot of things, so here’s another one to add to your mental catalog: Sticky elements don’t play nicely if they have to coordinate with other elements to make up…

Safari 18.0 is here.

The text-box-trim and text-box-edge properties in CSS enable developers to trim specifiable amounts of the whitespace that appear above the

Animate to and from intrinsic sizing keywords with `interpolate-size` and `calc-size()`

Let’s animate some CSS custom properties! This is a powerful way to approach CSS animations that would otherwise be tedious or impractical to implement. I’ll...

Selecting the *next* element in CSS can be done easily with the + combinator. Selecting the *previous* element used to be impossible, but now can be like :has(+ .el), and can be extended in either direction.

A comparison of the two proposed masonry specifications.

Recently I got an interesting performance bug on emoji-picker-element: I’m on a fedi instance with 19k custom emojis […] and when I open the emoji picker […], the page freezes for like a full…

The CSS Working Group released the first Public Working Draft for the CSS Values and Units Module Level 5. It describes the common values and units that CSS properties accept and the syntax used for them, and it comes with some interesting new features. A…

Sticky positioning is one of those CSS features that’s pretty delicate and can be negated by a lot of things, so here’s another one to add to your mental catalog: Sticky elements don’t play nicely if they have to coordinate with other elements to make up…

Excited to finally explore CSS state queries and Scroll Snap events. This article will showcase initial impressions and demos using these features.

We've all been there: you're working on a website and need to display a row of logos—clients, partners, sponsors—you name it. However, logos come in all shapes and sizes, and making them look good together can be quite challenging. How do you get...

The `clip-path` property with the `inset()` shape makes for some cool design opportunities. Here we'll expand on some existing ideas, improving them by not requiring any content duplication.

TL;DR: iOS Safari is more than an inconvenience for developers, it's the fundamental reason interoperability has been stymied in...