CSS Unit Converter (px, rem, em, pt, vw, vh)

Convert between CSS units — px, rem, em, pt, vw, and vh — with adjustable base font-size and viewport. Conversions update live in your browser.

Equivalent values

px
16
rem
1
em
1
pt
12
vw
0.8333
vh
1.4815

px/rem/pt conversions are exact (1in = 96px, 1pt = 1/72in). em is shown relative to the base font-size; in real CSS it depends on the element's own font-size. vw/vh depend on the viewport you set above.

About this tool

CSS measures length in several units that relate to each other through fixed rules and a few context values. This converter pivots everything through the CSS pixel: absolute units are exact (1 inch = 96px and 1 point = 1/72 inch, so 1pt = 1.3333px and 16px = 12pt), while the font-relative and viewport-relative units depend on context you control here. rem is calculated from the root (base) font-size, which you can set — the default 16px is the browser default — and em is shown relative to that same base, though in a real layout em resolves against the element's own font-size. vw and vh are percentages of the viewport width and height you specify, so 1vw at a 1920px-wide viewport is 19.2px. Use it to translate a design handed to you in points or pixels into the rem-based scale most modern stylesheets prefer, or to sanity-check a viewport-relative value. All math runs in your browser.

How to use it

  • Type a value and choose its unit.
  • Set the base font-size if your root is not the default 16px.
  • Set the viewport width/height if you are converting vw/vh.
  • Read the equivalent value in every other unit and copy them.

Frequently asked questions

How are px and pt related?
CSS defines 1 inch as 96 pixels and 1 point as 1/72 of an inch, so 1pt = 96/72 = 1.3333px and, conversely, 1px = 0.75pt. That makes the common 16px body text equal to 12pt — handy when a print or design spec is given in points.
What is the difference between rem and em?
rem is always relative to the root element font-size (the base you set here), so it is predictable across the whole page. em is relative to the font-size of the element it is used on, so it compounds when nested. This tool computes both from the base; in practice, verify em against the specific element.
Why do vw and vh need a viewport size?
1vw is 1% of the viewport width and 1vh is 1% of its height, so the pixel value changes with screen size. The converter uses the viewport dimensions you enter (defaulting to 1920×1080) to produce a concrete pixel equivalent.
Which unit should I use for font sizes?
rem is the common modern choice because it scales with the user's root font-size setting, improving accessibility, while staying predictable. px is fixed and ignores user preferences; em is useful for spacing that should scale with local text.
Are the conversions exact?
The px, rem, and pt conversions are mathematically exact given your base font-size. em equals rem here by design (same base), and vw/vh are exact for the viewport you specify. Real-page em and viewport values vary with context, which the tool notes.
Is my input sent anywhere?
No. All conversions are computed locally in your browser with no network request.

Related tools