Reduce or increase rem sizes on global scale in the config

[bzrncev]

For my last project, the default spacing and font sizes were too big for me. This is how I solve it in my config:

const reduceCSSCalc = require("reduce-css-calc");
const percentage = 0.9;

module.exports = {
    theme: {
        spacing: {
            ...
        "1": reduceCSSCalc(`calc(0.25rem * ${percentage})`),
        "2": reduceCSSCalc(`calc(0.5rem * ${percentage})`),
         ...
    },
    fontSize: {
            xs: reduceCSSCalc(`calc(0.75rem * ${percentage})`),
            sm: reduceCSSCalc(`calc(0.875rem * ${percentage})`),
            ...
         }
    }
}

It will be better if there is a way to specify a scaling percentage in the config and all spacing, font sizes, etc. to respect it because now my config file is a mess.

[adamwathan]

Easiest way to accomplish the exact same thing:

html {
  font-size: 14.4px
}

[bzrncev]

Wow, didn't know that. Thanks for the tip! 👍