Cascade layers recently [end of 2024] reached the completely arbitrary “baseline widely available” milestone, which means they have been available across all modern browsers for more than 30 months now.
I’ve been a huge advocate of cascade layers since day one. I can’t imagine writing CSS without layers. So obviously I have a lot to say about layers. But today I want to focus only on one point (and it’s worth repeating): Your CSS reset should be placed inside a cascade layer.

For users to experience a quality service it must be built in a robust way.

Progressive enhancement is a way of building websites and applications based on the idea that you should make your page work with HTML first.

Only after this can you add anything else like Cascading Style Sheets (CSS) and JavaScript.

All government services must follow progressive enhancement, even if part of the service or a parent service needs JavaScript.

The new CSS Color 4 specification has added the new oklch() notation for declaring colors. In this post, we explain why this is important for design systems and color palettes.

The oklch() functional notation expresses a given color in the Oklab color space. oklch() is the cylindrical form of oklab(), using the same L axis, but with polar Chroma (C) and Hue (h) coordinates.

I want to make emoji bigger than the text that surrounds them. At my age and eyesight, it can be difficult to tell the difference between 😃, 😄, and 😊 when they are as small as the text.

Is there a way to use CSS to increase the font size of specific characters without having to wrap them in an extra <span> or similar?

Yes! Although it is a bit of a hack.

Minimal snippets for modern CSS layouts and components

»Firefox is the only browser that supports the fancy element() CSS function (with a vendor prefix, but hey 🤷‍♂️). The function allows you to display images of arbitrary HTML elements on your page! And the best thing is: it's live!«

Open source browser tools for everyday use