A CSS UI library exploring how next-gen HTML & CSS features can change the way we create components. Designed to be used by professional teams as well as tinkering hobbyists. Everything is made with ease-of-use and scalability in mind. Last but not least - you copy and paste the components into your repo. It's the best way to have a complete understanding and ownership over your stuff.
https://open-props-ui.netlify.app/
Note
This is work in progress. Breaking changes are expected. Contributions are welcome!
This repo holds the code for the UI library and the docs. The docs are used as a testbed for the UI library.
pnpm i
pnpm docs:dev
Practically all established UI libraries need to take older browser versions into account. Some have only just dropped Internet Explorer. Some have barely discovered the power of CSS grid. Open Props UI starts from a blank slate and re-imagines how a component library could be built if you used the most modern features.
"If you only use the latest features, that means this is can never enter production"
Yes and no. Right now that's true for most components. The point is to let the spec and the components mature alongside each other and in time the library will be ready for production.
- Have sensible defaults without sacrificing flexibility and control
- Use modern HTML & CSS features
- Follow accessibility guidelines
- Serve as an inspiration
- Be scalable