CSS Unit Converter
Utility Tools
Convert between CSS units like pixels, rem, em, viewport width, and points. Essential for building responsive, accessible websites.
Conversion Type
Quick Values
Common Conversions (base: 16px)
Multiple Units
Convert between px, rem, em, pt, vw, and even degrees to radians for CSS transforms.
Custom Base Size
Set your root font size or viewport width for accurate conversions matching your project.
Quick Reference
Instant conversion table showing common values for quick reference without manual input.
CSS Unit Guide
PX (Pixels)
Absolute unit based on screen pixels. 1px = 1/96th of an inch. Good for borders and shadows.
REM (Root EM)
Relative to root font size (usually 16px). Best for typography and spacing. Enables user font scaling.
EM
Relative to parent element's font size. Useful for component-level scaling. Compounds when nested.
VW (Viewport Width)
1vw = 1% of viewport width. Perfect for fluid typography and full-width layouts.
PT (Points)
1pt = 1/72 inch. Traditional print unit. Useful when matching print designs.
DEG/RAD
Degrees and radians for CSS transforms. 180deg = π radians. Used in rotate(), skew().
Best Practices
- • Use rem for typography to respect user font size preferences and improve accessibility.
- • Use em for component spacing when you want elements to scale with their local font size.
- • Use px for borders and shadows where consistent visual weight is important.
- • Use vw/vh for full-screen layouts but combine with min/max for better usability.