Repository files navigation

Tiny5^th generation CSS-in-JS library that you can actually use in production.Motto ofnano-css is simple:create the smallest possible CSS-in-JS library and provide all features of any other library through addons.

• Only0.5 Kb in base configuration,e.g.styled-components is15.1Kb
• Library-agnostic — use it standalone, with React, Preact, Vue.js, or any other library
• Isomorphic — render on server and browser, generates stable class names, and re-hydrates
• Performant —simply the fastest library; does not create wrapper components, does not use inline styles or inline<style> elements, but caches all styles for re-use and injects CSS using.insertRule() for performance
• @media queries andanimation@keyframes are supported
• Auto-prefixes your styles
• Extract CSS into external style sheet
• Public domain —Unlicense license

For pre-configured simple-to-use package seenano-theme, which builds on top ofnano-css.

• Installation
• Addons
  • put() —demo!
  • rule() —demo!
  • drule() —demo!
  • sheet() —demo!
  • dsheet() —demo!
  • jsx() —demo!
  • useStyles() —demo!
  • withStyles() —demo!
  • decorator —demo № 1 anddemo № 2
  • component —demo!
  • style() —demo!
  • styled()() —demo!
  • hyperstyle() —demo!
  • stable
  • atoms —demo!
  • emmet
  • nesting
  • keyframes()
  • hydrate()
  • prefixer
  • stylis
  • unitless
  • !important
  • :global
  • animate/*
  • reset/*
  • reset-font
  • googleFont()
  • limit
  • amp
  • virtual
  • spread
  • array
  • snake —demo!
  • tachyons
  • rtl
  • extract
  • sourcemaps
  • .units
  • cssom
  • vcssom
• Presets
• Server-side rendering