CSS Unit Converter

Convert between CSS units — px, rem, em, %, vw and more.

Speaking the same unit as your layout

CSS offers many units, and they behave differently: pixels are fixed, rem and em are relative to font size, percentages and viewport units are relative to context. This converts a value between them, so you can work in whichever unit suits and produce the one your stylesheet needs, based on the root font size you set.

Enter a value and unit, and see its equivalents.

Fixed versus relative units

The real skill is choosing the right unit for the job, and conversion helps you move between them without doing the arithmetic. Fixed pixels are predictable but ignore user font-size preferences; rem scales with the root font size, which is better for accessible type; em compounds relative to its parent, powerful but easy to lose track of; viewport units flex with the window, ideal for full-screen sections. Converting a pixel value you have in mind into rem, or vice versa, lets you keep a mental picture of the size while writing the unit that behaves the way you want.

Questions & answers

Which CSS units can it convert?

px, rem, em, percentages and viewport units like vw, based on the root font size you set.

Why use relative units over pixels?

Relative units like rem scale with the user's font-size preference and the layout context, which pixels ignore.

Is anything uploaded?

No. The conversion happens in your browser.

More Developer tools