Back to Designers
Parameters
Results
- 1×
- 4 px / 0.25 rem
- 2×
- 8 px / 0.5 rem
- 3×
- 12 px / 0.75 rem
- 4×
- 16 px / 1 rem
- 5×
- 20 px / 1.25 rem
- 6×
- 24 px / 1.5 rem
- 7×
- 28 px / 1.75 rem
- 8×
- 32 px / 2 rem
How it works
Generates an integer spacing scale from a base unit (often 4px or 8px).
Who it's for: UI designers keeping padding and gaps consistent.
Each step is base × n for n = 1…steps.
How to use
- Enter Base unit and number of Steps.
- Use highlighted 4× as a common medium gap.
Related tools
More calculators in the same category
- Color Palette GeneratorGenerate a 5-shade palette from a base color
- Image CompressorCompress JPEG and WebP images locally
- Golden RatioMajor and minor segments
- Contrast CheckerWCAG contrast ratio between two hex colors
- px ↔ rem ConverterConvert pixels to rem and back at any root font size
- Type Scale GeneratorModular typography scale from a base size and ratio