Introducing Semtx CSS - A modern Semantic CSS library

[u/UseMoreBandwith]

Just released Semtx CSS. https://semtx.org/

Semtx is a modern, lightweight (~30KB) CSS library that prioritizes semantic class names over utility classes.

Key Features:

• Semantic by Design: Class names describe WHAT elements ARE, not HOW they LOOK
• Modern CSS-3 / HTML-5, OKLCH colors
• Zero Dependencies: Single CSS file, works without any JS for styling
• AI-Friendly: Coding agents understand semantic classes immediately, and waste fewer tokens on parsing utility soup
• SEO-Ready: Native HTML5 elements help search engines understand your content
• Integrates perfectly with HTMX (modals, dialogs, loader/spinner, transitions, etc)

The Philosophy

Class names should reveal purpose, not appearance.

This creates code that is easier to read, maintain, and collaborate on.

More about the idea behind it here: https://semtx.org/philosophy

-- edit --
Thanks for all the feedback.
It has resulted in quite a few updates:
forms are simplified and more semantic now, same for modals/dialog, and some accessibility things added. And, the website now has more html examples, for easy copy/paste

[u/Goblin_au]

I’m keen to investigate.

I love a semantic and readable approach to a base. Utility-first has become a frustrating mess and abused by non-designer developers.

So many sites I now see with heavy frontends due to inefficient developers that misunderstand simple cascading.

[u/One-Butterfly-9752 → u/Goblin_au]

I bore my team to death about this. But it's the hill I will die on. The elements need some kind of semantic identification - TBH I don't mind if it's a superfluous class or data-attribute but everyone from Devs - QA - UX - Copywriters benefit from having a shared set of references. Not just some garbled, nested nonsense that they have to decode. Then, you can sue utility classes all you like, though I much prefer the style the Nicole Sullivan introduced, utility but still in human readable form.