home blog resources about

utility

Spacing Scale Generator

Generate CSS spacing design tokens from a pixel base, rem base, and token prefix.

4 inputs

Input

4 fields

Base size (px)Each step multiplies this pixel value.StepsNumber of spacing tokens to generate.REM base (px)Used to convert pixel values into rem values.Token prefixUse lowercase letters, numbers, and hyphens.

CSS variables

idle

yukt.tools

blog resourcesfree & open