My CSS wish list 2024
posted on
Following last year, I created a CSS wishlist for 2024.
Before I get into the details, I have to say that creating a wishlist almost feels wrong because there are more features in CSS today than I could have ever wished for. So, I'd like to take this opportunity to thank everyone who contributed to CSS being where it is today: spec writers, invited experts, browser developers, everyone involved in Interop 202*, dev rels, bloggers, and people who report bugs and contribute to discussions about new and existing features. Thank you very much!
Container Style Queries
We need container style queries in all browsers. They will change how we write CSS and make our stylesheets more flexible, scalable, and robust. You can read why I believe that on the 12 Days of Web, or you can watch my talk from last year's CSS Day.
Current support: Chrome/Edge 111+
Scope
I understand how someone can be skeptical about the usefulness of scoping, but trust me, once you learn how it works and what it can do for you, you'll also be convinced it's another missing piece in the puzzle.
Current support: Chrome/Edge 118+, Safari TP
Mixins
Mixins in native CSS? Yes, please!
Current support: none
State Queries
State queries will allow us to query when something is in a specific state, like sticky. Here's an early demo presented by Una.
Current support: none
Gammut Mapping
I was disappointed to learn that there's no real gamut mapping in oklch/oklab. I hope browser vendors listen to the feedback from developers and reconsider their decision.
Animation of discrete properties
The transition-behavior property and the @starting-style at-rule are super useful because they allow you to animate discrete properties like display
. I'd love to see support in all browsers.
Current support: Chrome/Edge 117+
Other wish lists
Here are some other 2024 CSS wish lists: