CSS Unit Converter - px to rem, em, vw, vh
Convert between px, rem, em, vw, vh, %, and pt instantly. Configure base font size and viewport dimensions for accurate responsive design calculations.
CSS Units
When to Use
Font sizes - use rem so they scale with browser settings.
Spacing - rem or em for consistent scaling.
Widths - % or vw for responsive containers.
Borders - px for precise, fixed sizes.
Hero sections - vh for full viewport height.
FAQ
How many px is 1rem?
By default, 1rem = 16px. If your project uses a different root font size, adjust the Base Font Size setting above.
Should I use rem or em?
Use rem for most things - it's consistent and predictable. Use em only for component-scoped sizing relative to the parent.
What is the difference between vw and %?
vw is always relative to the viewport width. % is relative to the parent element, which varies by context.
How do I convert 30px to rem?
With a 16px base: 30 / 16 = 1.875rem. Enter 30, select px, and the converter shows all equivalents instantly.