postcss-rem-func

PostCSS rem func

PostCSS plugin to use calculate rem values.

Example

Input

.demo {
  font-size: rem(24); /* using default 16 */
  padding: rem(5, 10); /* Explict base */
}

Output

.demo {
  font-size: 1.5rem; /* Simple */
  padding: 0.5rem; /* Explict base */
}

Options

With baseline to 10:

.demo {
  font-size: 2.4rem; /* Simple */
  padding: 0.5rem; /* Multiple values */
}

Usage

Install with npm i postcss-rem-func and use with PostCSS:

postcss([require("postcss-rem-func")]);

Example with custom options:

postcss([
  require("postcss-rem-func")({
    baseline: 10, // Default to 16
    precision: 6, // Default to 8
  }),
]);

See PostCSS docs for examples for your environment.