a17t: an atomic design toolkit for pragmatists (open souce)

Hey everyone! Over the past few weeks, I've been building an open source library called a17t (an abbreviation of atomic design toolkit). It's a pure-CSS library, which means you can integrate it into any JS stack—React, Vue, Ember, whatever! It's intended to be used either own its own or in conjunction with Tailwind. It's also deeply atomic (here's why that matters).

Here's why you should use a17t:

• Most CSS frameworks are heavy and bloated. They provide too much. They let you move quickly at first, but soon you're stuck with your entire interface looking like the framework. Customization is a pain.
• Utility frameworks like Tailwind are awesome, but are hard to use at the beginning. They make it easy to write CSS efficiently, but they still require you to style <input>s yourself. That's a pain.

a17t works by providing you with core interface elements—things like buttons, inputs, cards, etc.—and letting you assemble them any way you want. It's easy to customize with CSS variables, and uses prescriptive classes like ~neutral or ~warning to specify tone. It's super flexible, but also pretty intuitive.

Here's a link to the GitHub repo (give it a star!): https://github.com/milesmcc/a17t
Here's the demo & documentation site: https://a17t.rmrm.io

Would love to hear whatever feedback you may have. I want a17t to be the easiest way to build beautiful interfaces, and that will only happen if others help me make it better.

P.S.: Like this design language? Here's the side project I built it for: https://lensant.com