Design.dev design.dev

PX to REM Converter

Convert pixel values to REM units. Batch convert multiple values, generate CSS variables, and use common scale presets.

Quick Convert

px (1rem)
1rem

Batch Convert

Enter multiple pixel values separated by commas, spaces, or new lines.

Tip: Paste values from your design tool or type a comma-separated list

Output Format

Rounding

Scale Presets

Click a preset to load common spacing or typography scales.

4px Grid

Base-4 spacing system

4, 8, 12, 16, 20, 24, 32, 40, 48

8px Grid

Base-8 spacing system

8, 16, 24, 32, 40, 48, 56, 64, 80

Tailwind Spacing

Tailwind CSS default scale

4, 8, 12, 16, 20, 24, 32, 40, 48, 64, 80, 96

Bootstrap Spacing

Bootstrap 5 spacers

4, 8, 16, 24, 48

Minor Third Type Scale

Ratio 1.2

12, 14, 17, 20, 24, 29, 35

Major Third Type Scale

Ratio 1.25

12, 15, 19, 23, 29, 37, 46

Perfect Fourth Type Scale

Ratio 1.333

12, 16, 21, 28, 37, 50, 67

Fibonacci Spacing

Golden ratio inspired

8, 13, 21, 34, 55, 89

Export

/* Enter values above to generate code */

Common Conversions

Quick reference for common pixel to rem conversions (base 16px).

Copied!