CSS Units Converter
Convert between px, rem, em, pt, % and more, using the root and parent font sizes you provide.
What is Units Converter?
A converter for CSS lengths: the absolute units (px, pt, pc, in, cm, mm, Q) and the relative ones (rem, em, %, vw, vh). A table shows the value in every supported unit so you can pick the one that fits the design.
How it works
Absolute units are converted through the CSS reference pixel (1in = 96px, 1pt = 1/72in). Relative units need context, so the root font size, parent font size and viewport dimensions are inputs: `1.5rem` becomes 24px only when the root is 16px, and `2em` depends on the parent's font size.
- Paste the source. Drop in code, a stylesheet, a query or a selector list. Everything is read locally — the page never uploads what you paste.
- Choose the options. Indent width, quote style, keyword case or target browsers. The result updates as you change them, so you can see the effect immediately.
- Copy or download. Copy the result to the clipboard or download it as a file. Reset clears the form and returns every option to its default.
Examples
Design handoff in pixels
Convert a 24px gap to 1.5rem at a 16px root so the spacing scales with the user's font-size setting.
Print stylesheet in points
A 12pt body size is 16px on screen and 4.23mm on paper; the table gives all three without a calculator.
Common mistakes
Expecting a formatter to fix invalid code
Formatting is whitespace and quoting. A missing brace, an unclosed tag or an unquoted variable survives the round trip and is reported instead — check the findings list.
Minifying without running the tests afterwards
Even a safe, non-mangling minifier can expose an existing automatic-semicolon-insertion bug. The JavaScript Minifier keeps the newlines that matter, but re-run your tests before shipping.
Treating a rewritten query as verified
The SQL Dialect Converter translates the syntax it can prove; data types, casts and function differences are listed for review, not guessed. Run the converted query against a real database.
Renaming or reformatting generated files
Regenerating a formatter's output is a no-op only if the formatter is the same one that produced it. Keep generated code out of the round trip and format the source it came from.
Frequently asked questions
Why is my em conversion different from rem?
`rem` is always relative to the root element's font-size, while `em` is relative to the element's parent (or to the element itself for its own font-size). Fill in both fields and the difference shows up — that difference is the reason `em` values compound.
What is a CSS pixel?
The unit the CSS specification defines for screen media: 1px equals 1/96in at the reference viewing distance. It is not a device pixel — a 2× retina display maps 1 CSS pixel to 2 device pixels.
Can I convert percentages of width?
Not with this tool. Percentages on `width` are relative to the containing block, which the page cannot know from a value alone — that is why `%` here is offered as a font-size percentage (relative to the parent font size) with the parent size as an input.