The Future of CSS: Target Multiple Classes with the Class Prefix Selector
cdrnsf
21 points
9 comments
August 19, 2026
Related Discussions
Found 5 related stories in 39.2ms across 4,128 title embeddings via pgvector HNSW
- CSS properties you should know for better text designs ibobev · 100 pts · August 11, 2026 · 44% similar
- HTML Can Do That encyclopedism · 32 pts · August 19, 2026 · 41% similar
- CodePen 2.0 robin_reala · 154 pts · July 30, 2026 · 39% similar
- Small, native web tricks worth remembering marcomezzavilla · 213 pts · August 21, 2026 · 38% similar
- Show HN: TermDOM – HTML, CSS and JavaScript (With a Real DOM) for TUIs and CLIs bikeshaving · 12 pts · August 11, 2026 · 36% similar
Discussion Highlights (5 comments)
jjcm
In their example, they list btn-* as the selector catch all for .btn-primary|secondary|danger. I can't help but think why not just do, .btn.primary for the class name, and just target .btn with the selector? Don't get me wrong, I appreciate the convenience of this, but I do worry about selector slowdown with what will effectively turn into a regex at some point. I'm dubious that this is needed.
dymk
Personally, I don't think this is a great change to CSS. I prefer being able to grep for identifiers to see where they're used. Now you can't rely on that - maybe a rule is now covered by a prefix selector.
graypegg
*[class*=btn-] { ... } I know you'd be matching on the class attribute instead of a single classname, but I feel like we'd see this much more out-in-the-wild if there was an apetite for this syntax feature right? Like, the issue of `some-other-btn-primary` also matching the rule is pretty inconvenient, but definitely tolerable if people preferred writing style rules like this.
CM30
This is pretty neat. Definitely seems like something that'll make writing CSS for similar classes a lot more convenient, and another example of how modern CSS seems to be adding a ton of features to make front-end development a lot more efficient. The increased level of power HTML, CSS and JavaScript have now is honestly kinda insane.
lukeify
So the class prefix is actually `-*`, not `*`: > The Class Prefix Selector is currently limited to hyphen-separated prefixes, at least at first. Other separators, like _, might be added as possibilities in the future as we receive request from authors like yourself about what would be needed. I'm sorry, but how did they think this a good idea? Why treat the hyphen with special qualities over any other non-whitespace separator? The argument around "accidental overselection" seems pretty weak to me. If you're using a character with known special properties like the asterisk in CSS then you should understand you're wielding a more powerful hammer implicitly.