This is a small project, in which I try to simplify my life by abstracting away the complexities UI design has to offer 😨. I use fractures for rapid prototyping and building out design systems.
Although it is really just a thin atomic CSS layer, please consider the project opinionated.
Have questions? Open an issue on GitHub.
- You can design with — not around it. Leaves UI untouched.
- Atomic, non blocking.
- Manageable cognitive load, with a small footprint.
- Fast in every way.
- Framework agnostic.
- I don't think percentage based CSS breakpoints are universal enough, so you have to handle responsive states yourself.
- You can use it in production, but you have to create your own fallbacks. The prefixed version handles some, but not everything.
I started this prject as my own reset.css when having a reset css was cool. It was grown into a common.css, then a tools.css. Now it's somewhat atomic.
I've also learned some tricks from these smart people:
- Atomic Design by Brad Frost
- Functional Programming, CSS, and your sanity by Jon Gold
- Cooking with Design Systems by Dan Mall
- Pure UI by Guillermo Rauch
- Grid by Example by Rachel Andrew
The concept of functional CSS is not new.
There are quite a few similar projects out there you can choose from: #functional-css.