PostCSS plugin for creating CSS units based on numerical sequences

2 months ago from

With design systems being even more prevalent these days I've wanted to reference custom units in my stylesheets so I can keep things like font sizes, paddings, margins etc consistent throughout my designs. For even longer I've had an idea to use maths to create a sequence of numbers which can be reused throughout a design.

Today I'm uploading a first draft of a PostCSS plugin which converts a custom unit into normal CSS. I know there are quite a few already out there but what make this one a little special is that you can associate a pattern with a unit that allows you to gain aesthetic pleasure from your work using mathematics. :)

The plugin is quite flexible and should meet any need you desire, although I'm sure there will be some scenarios I haven't anticipated for. Check out the examples at the bottom of the file to get an idea of what you can do. I would be grateful for your feedback if you decide to try it. It's my first time making a node package module so the code might be a little rough looking, so any help on that front would obviously be appreciated.

Thanks again.