Styled Component design system for React/Preact based on Pure CSS, a set of small, responsive CSS modules that you can use in every web project.
CSS with a minimal footprint.
Pure Components are ridiculously tiny. The entire set of modules clocks in at 90KB* minified and gzipped. Crafted with mobile devices in mind, it was important to us to keep our file sizes small, and every line of JS was carefully considered. If you decide to only use a subset of these modules, you'll save even more bytes.
- Minimal - Only the components you need. Extend easily with styles to customize.
Want to prototype a quick app? Or just need a quick grid? We've got you covered with simple, responsive components
Check out the documentation here with each component, it's props, and examples on how to use them.
- main - Pure CSS optimized
- theming - Example on how to setup components for theming
This project primarily uses StorybookJS for development.
git clonethis project
npm run storybookor
npm run dev
Building for Production
npm run build
This runs 3 separate Babel build processes that generates code for:
- Browser (CDN scripts) -
- Node (CommonJS modules) -
- ES6 Modules (npm frontend code) -
You won't find these folder in this git repo, but you can generate them yourself by running the command above, or download them from a CDN like unpkg
Release on NPM
- Change version in
package.json(per semver rules)
- Login to npm CLI
npm run release
- Install semver to handle versioning
- Multi-layered dropdown display with keyboard input
- Extra pages (Layouts, Customize/Theming/Extend)