PX to REM Converter

About this tool

The CSS Unit Converter turns one value into eleven CSS length units at once: px, rem, em, %, pt, pc, cm, mm, in, vw and vh. Type a Value, choose the From unit, and a table of cards shows the equivalent in every unit. Absolute units use the CSS reference of 96px per inch. rem, em and % are all calculated from the Base font size field (default 16px), so em assumes the parent has the same font size as the root. vw uses the Viewport width field (default 1920px), and vh uses a height derived from that width at a 16:9 ratio (1080px at the default), since there is no separate height field. Click any card to make that unit the new input. vmin, vmax, ch and ex are not included. This is an everyday tool for frontend developers and designers turning pixel specs into rem, or print sizes into screen pixels, and it runs entirely in the browser.

Why use it

• Shows eleven CSS length units at once — px, rem, em, %, pt, pc, cm, mm, in, vw and vh.

• Configurable base font size and viewport width for relative unit conversions in your project context.

• All units update in real time as you type.

• Click a result card to convert onward from that unit.

How to use

1. Type a number into Value and pick its unit from the From unit menu.
2. Set the Base font size (px) used for rem, em and %; the default is 16.
3. Set the Viewport width (px) used for vw; vh uses 9/16 of that width as the viewport height.
4. Read the equivalents in the cards below, which update as you type.
5. Click any card to make that unit and value the new input, then select and copy the number you need.

When it helps

• Converting design specs in pixels to rem for scalable, accessibility-friendly CSS.
• Checking how a vw-based width maps to pixel values at a target viewport width.
• Converting point (pt) values from print specs to CSS pixel equivalents.
• Working across design tools (which typically use px) and CSS codebases (which prefer rem).

Examples

24 px (base font size 16)

1.5rem, 1.5em, 150%, 18.0005pt, 1.5pc, 0.635cm, 6.35mm, 0.25in, 1.25vw, 2.22222vh (viewport width 1920)

100 vw (viewport width 1440)

1440px, 90rem, 15in, 38.1cm, 177.778vh

12 pt

15.9996px, 0.999975rem, 4.23322mm, 0.166662in

1 rem (base font size 10)

10px, 1em, 100%, 7.50019pt, 0.625pc, 2.64583mm

Tips

• Use rem for typography and major spacing — it scales with user font size preferences for accessibility.
• Set html { font-size: 62.5%; } and many developers can write 1.6rem instead of 16px (1rem then equals 10px). Enter 10 as the base font size to mirror this trick.
• Avoid em for nested components — it cascades from the parent's font-size and can compound unpredictably.
• Use vh sparingly for full-screen hero sections; mobile browser address bars cause the visible viewport to differ from 100vh.
• Use ch (1ch = width of '0') for max-width on text columns — it produces consistent line lengths regardless of font size.
• When converting spec px to rem, divide by your root font-size (typically 16) instead of guessing — the converter does this for you.

Frequently Asked Questions

Glossary

Absolute units

CSS units that map to a fixed physical or virtual size regardless of context: px, pt, pc, cm, mm, in. Use sparingly — they don't scale with user font preferences.

Relative units

Units whose computed value depends on another reference: em (parent font-size), rem (root font-size), %, vh/vw (viewport), ch/ex (font metrics). Preferred for accessible, responsive design.

rem (root em)

Length relative to the root html element's font-size. 1rem = 16px by default browser settings. Resilient to nesting because the reference is always the document root.

em

Length relative to the current element's font-size. Cascades through nesting: 2em on a child of a 1.5em parent renders as 3x the grandparent's font size — useful but error-prone.

Viewport units (vh, vw, vmin, vmax)

Lengths based on the visible viewport. 1vh = 1% of viewport height, 1vw = 1% of width. vmin/vmax pick the smaller/larger of the two, useful for orientation-agnostic sizing.

REM root font size

The font-size set on the html element, which all rem units reference. Browser default is 16px; some teams set it to 62.5% (=10px) so 1rem = 10px for easier mental math.

ch unit

Length equal to the width of the '0' (zero) character in the current font. Useful for sizing text columns by character count (e.g. max-width: 65ch for readable line length).

Point (pt)

1pt = 1/72 inch = 1.333... px at 96dpi. Inherited from print typography; mostly used in @media print stylesheets.

DPI (dots per inch)

Density of pixels per physical inch. CSS assumes 96dpi as the canonical screen resolution for px-to-physical-unit conversions.