Atomic CSS for CSS Modules
Switch branches/tags
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
docs
src
.gitignore
.npmignore
LICENSE
README.md
build.js
package.json

README.md

hydrogen.css

Atomic CSS for CSS Modules

npm

Installation

NPM

npm i -S hydrogencss

Yarn

yarn add hydrogencss

Usage with CSS Modules

There are two ways to compose with each value. The first:

.container {
  composes: <value> from 'hydrogencss/<property>.css';
}

With this way you will be importing all the classes within <property>.css, unless you are clearing up the unused CSS.

The alternate way to import is

.container {
  composes: <value> from 'hydrogencss/<property>/<value>.css';
}

Example:

.container {
  composes: flex from 'hydrogencss/display/flex.css';
}

Which will just include:

.flex { display: flex; }

To see all the properties and values available please check the docs folder.