A fun use case for @custom-media queries is to toggle styles based on a feature flag.

Imagine an edge worker that toggles true or false in a CSS file, and the rest of your styles can tap in and adapt.

you name it.

Define an enabled feature like:

Or a disabled feature like:

Use them like:

Use nesting, query from JavaScript, or both.

The spec, a CSS Tricks article, post by Stefan Judis, a polyfill, a premade set in Open Props (anticipating the feature), and there's been good browser implementation activity recently in Firefox (marked FIXED!) and Chrome, not webkit as much.

I'm excited, it's a great feature.