This use-case for blend modes is making me thirsty.
Also: look who’s blogging again!
- Springy easing with
linear()- Typed custom properties
- View transitions for page navigation
- Transition animation for
dialogandpopover- Transition animation for
details- Animated adaptive gradient text
Container queries can’t be used in the sizes attribute for responsive images. Here, Jason breaks down why that is (spoiler: it’s the lookahead pre-parser) and segues into a truly long term solution: a “magical” image format.
If you’ve ever thought it felt weird to put media conditions inside the HTML for responsive images, this will resonate.
There’s no browser support yet but that doesn’t mean we can’t start adding prefers-reduced-data to our media queries today. I like the idea of switching between web fonts and system fonts.
A follow-up to full-bleed layout post I linked to recently. Here’s how you can get the same effect with using CSS grid.
I like the use of the principle of least power not just in the choice of languages, but within the application of a language.
When you’ve got a single centered column but you want something (like an image) to break out and span the full width.
A redesign with modern CSS.
Adding another theme to my stylesheet switcher.
Adarktio
A clever technique I learned from Trys.