PX to REM Converter

Convert px to rem (and back) for accessible, responsive CSS.

Free forever No signup Runs in your browser
The short answer

With the default 16px root font size, 24px = 1.5rem. Rems scale with the user’s font-size settings — px doesn’t — which is why accessible, responsive sites use rem for text. Convert a whole batch at once here.

How to use the px to rem converter

  1. Enter px values.
  2. Set your root font size (default 16).
  3. Copy the rem values.

PX to REM Converter — FAQs

Why use rem instead of px?

Rem respects the user’s browser font-size setting — crucial for accessibility. Px stays fixed even when users need larger text.

What is the default root font size?

16px in all browsers, unless changed. So rem = px ÷ 16 by default.

When is px still okay?

Borders, shadows and hairlines (1px) — things that shouldn’t scale with text size.

rem vs em?

Rem is relative to the root; em is relative to the parent element and compounds confusingly in nested layouts. Prefer rem.

Keep exploring

People who used this also opened:

dev

HEX to RGB Converter →

Convert HEX colours to RGB and HSL — and back.

 dev

Contrast Checker →

Check text contrast ratios against WCAG accessibility standards.

 generate

Color Palette Generator →

Generate harmonious colour palettes from any base colour.

 dev

Base64 Encoder / Decoder →

Encode and decode Base64 — for tokens, images and data URIs.