CSS Unit Converter

Convert between px, rem, em, vw, vh, pt, and pc units. Set custom root font size, element size, and viewport.

Convert From
px16px
rem1rem
em1em
vw1.11111vw
vh1.77778vh
pt12pt
pc1pc

Converts a single value across px, rem, em, vw, vh, pt, and pc — and unlike a static conversion table, it lets you set the context that four of those units depend on: root font size, element font size, and viewport width and height. Each result row copies with its unit suffix attached, ready to paste into a stylesheet.

Fixed ratios vs context-dependent units

Three of the units convert by spec-fixed ratios that never change: 1px = 0.75pt and 1pc = 16px, so 96px = 72pt = 6pc on every screen. CSS points are defined off the CSS pixel, not physical ink, so 12pt on screen is exactly 16px regardless of display DPI. The other four are relative, which is the whole reason this tool has a config row: 24px is 1.5rem at a 16px root but 1.33333rem at 18px, and it is 1.66667vw at a 1440px viewport but a different number at every other width. A vw value copied from this tool is only correct for the viewport you typed in — that is the nature of the unit, not a rounding issue. Results are shown to six significant digits with trailing zeros stripped.

24px at the default context (16px root, 1440x900 viewport)
Input: 24 px
Output: 1.5rem / 1.5em / 1.66667vw / 2.66667vh / 18pt / 1.5pc

Step by step

  1. Set the root font size if your site changes it on html {} — the default 16px is only right if you haven't.
  2. Set the element font size; this is the reference for em results and frequently is not 16px.
  3. Set viewport width and height for the vw/vh rows (defaults are 1440 x 900).
  4. Enter a value, pick its unit, and copy any of the seven converted rows.
Good to know: The em trap: for font-size declarations, em resolves against the parent's font size, but for padding, margin, and width it resolves against the element's own font size. Set the 'Elem font' field to whichever of those two applies to the property you are writing, or the number will be confidently wrong.

This tool is strictly CSS lengths. Physical quantities — inches to centimeters, and so on — live in the unit converter.