Blog · WordPress

New CSS Class Prefix Selector Heads to Selectors Level 5 Spec

A CSS feature that has been discussed since 2024 has taken a step toward becoming reality. According to CSS-Tricks, a new class prefix selector, written as .btn-*, has been formally adopted into the Selectors Level 5 spec draft. The proposal was originally floated by Lea Verou and recently highlighted by developer Bramus, who tracks emerging CSS and Chrome features closely.

The goal is to simplify a common styling pattern. Developers who want to apply shared styles across a family of classes, like .btn-primary, .btn-secondary, and .btn-danger, currently have three options. They can list every class explicitly (verbose and hard to maintain), use substring attribute selectors like [class^=”btn-“] (which reportedly carries performance drawbacks), or repeat shared properties in a base class. The new .prefix-* syntax aims to replace the substring selector approach with something more readable and, according to its proponents, more efficient for browsers to match.

Not everyone is convinced it is necessary

The article notes pushback from developer Brian Kardell, who questioned whether the new selector is meaningfully more optimizable than the attribute selectors it aims to replace, since the two patterns overlap in what they can match. That leaves an open question about whether the performance argument for the new syntax holds up.

The spec currently has some limitations worth flagging for site owners. The wildcard only matches dash-separated prefixes, so patterns like .prefix*, .prefix_*, or suffixed variants like .prefix-*-suffix are not supported. The draft also implies, without explicitly stating, that the new selector carries the same specificity as a standard class selector.

What this means for WordPress and hosting teams

This is a very early-stage spec change, not a shipped browser feature. Since it is not yet part of Baseline, any real-world use would require wrapping it in an @supports selector(.prefix-*) feature query for graceful fallback. For WordPress theme and plugin developers who maintain large CSS files with repetitive class families (utility classes, button variants, grid systems), this is worth watching as a potential future simplification, but there is nothing to implement yet. There is also an open community request to extend similar prefix matching to custom elements and web components, which would broaden its usefulness further if adopted.