CSS Toolkit is a lightweight and scalable collection of CSS utilities.
npm install css-toolkit
CSS Toolkit is a lightweight and scalable collection of CSS utilities. It uses an
expressive approach to writing lightweight, scalable utility classes that are easy
to write and understand.
The toolkit does not impose any theme-specific styles or UI components, so
you're free to architect your code in the way that you want.
Only 2.5kb gzipped!
Homepage: http://css-toolkit.com
Source: https://github.com/adsric/css-toolkit
Choose one of the following options:
1. Download and add the main file of the CSS Toolkit in the header of your
project. For example:
``html`
Or use the CDN Link
`html`
2. Install with npm: And
build your website-specific theme styles in your build process with PostCSS.
For example:
`css
@import "css-toolkit";
:root {
--body-color: #fff;
--body-bg: #333;
}
`
3. Clone the git repo —
https://github.com/adsric/css-toolkit.git - and explore all the code!
* Designed with progressive enhancement in mind.
* Modular-based development.
* Modern CSS features (Future-proof).
* Includes:
* autoprefixer adds vendor prefixes, using data from caniuse.custom media queries
* CSS spec to to have semantic media queries.custom properties & var()
* transformation of native CSS spec custom properties.custom selectors
* CSS spec to create your own selectors.reduced calc()` allows you to use safely calc with custom properties & var().
*
* No Side Effects – things behave exactly as expected with design-agnostic semantic classes.
* Unassuming – styles that don’t dictate what things should look like.
* Extensive inline and accompanying documentation.
Take a look at the documentation table of contents.
This documentation is bundled with the project, which makes it readily
available for offline reading.
* Edge
* Firefox 28+
* Google Chrome (latest)
* Internet Explorer 11+
* Opera (latest)
* Safari 6.1+
The code is available under the MIT license.