T

Text Machine

Powerful text tools, in your browser

CSS Unit Converter

Enter a value and select units to convert. Adjust advanced settings for 'em', 'rem', 'vw', 'vh', and '%' calculations.

CSS Unit Converter
Common CSS Unit Conversions
FromToFormula
pxrempx ÷ rootFontSize
pxempx ÷ parentFontSize
pxvw(px ÷ viewportWidth) × 100
pxvh(px ÷ viewportHeight) × 100
px%(px ÷ parentFontSize) × 100
Unit Definitions

px (Pixels): Pixels; an absolute unit relative to the viewing device.

em: Relative to the font-size of the parent element.

rem: Relative to the font-size of the root (html) element.

vw/vh: 1% of the viewport width.

%: Relative to the parent element's value for the same property (e.g., font-size of parent for font-size conversion).

pt (Points): Points; an absolute unit (1pt = 1/72 of an inch).

in, cm, mm: Inches; an absolute unit (1in = 96px)., Centimeters; an absolute unit (1cm ≈ 37.8px)., Millimeters; an absolute unit (1mm = 1/10th of a centimeter).

How to use CSS Unit Converter

  1. 1

    Enter a value and units

    Type the number you want to convert, then pick the From unit and the To unit, such as px to rem.

  2. 2

    Set advanced context

    For relative units, open Advanced Settings to set the root font size, parent font size, and viewport width and height used in the math.

  3. 3

    Convert

    Click Convert to calculate the equivalent value, or use Swap to reverse the From and To units.

  4. 4

    Copy the result

    Use Copy Result to grab the converted value for your stylesheet.

Frequently asked questions

Which CSS units can it convert between?
It converts among px, em, rem, %, vw, vh, pt, in, cm, and mm, so you can move freely between absolute units and the relative, responsive units used in modern CSS.
Why do em, rem, and viewport conversions need extra settings?
Those units are relative, so their pixel value depends on context. The advanced settings let you set the root font size for rem, the parent font size for em and %, and the viewport width and height for vw and vh, which makes the results match your real layout.
What base font size does it assume?
By default it uses 16px, the typical browser root font size, for em and rem conversions. You can override the root and parent font sizes in Advanced Settings if your design uses a different base.
How accurate are the absolute unit conversions?
Absolute units follow the CSS spec, where 1in equals 96px, 1pt equals 1/72 of an inch, and 1cm is about 37.8px, so conversions between px, pt, in, cm, and mm are exact.
Is the converter free and run locally?
Yes. It is free with no registration, works on mobile, and performs every calculation in your browser, so no data is sent to a server.

Related tools

Keep going with these handy tools

CSS Vendor Prefix Generator

Meta Tag Generator

Robots.txt Generator

Open Graph Previewer

HTML Entity Encoder/Decoder

HTTP Header Viewer