calc() support for Rework

Usage no npm install needed!

<script type="module">
  import reworkCalc from '';


rework-calc Build Status

A Rework plugin to support calc(). Particularly useful with the rework-vars


npm install rework-calc


As a Rework plugin:

var rework = require('rework');
var calc = require('rework-calc');

var css = rework(cssString).use(calc).toString();

Supported feature

This simply add calc() support, a feature to do simple calculations. This can be particularly useful with the rework-vars plugin.

Note: When multiple units are mixed together in the same expression, the calc() statement is left as is, to fallback to the CSS3 calc feature.

Example (with rework-vars enabled as well):

:root {
  --main-font-size: 16px;

body {
  font-size: var(--main-font-size);

h1 {
  font-size: calc(var(--main-font-size) * 2);
  height: calc(100px - 2em);


body {
  font-size: 16px

h1 {
  font-size: 32px;
  height: calc(100px - 2em)

See unit tests for another example.

Unit tests

Make sure the dev-dependencies are installed, and then run:

npm test