What root font size should I assume?

Browsers default to 16px, but users and design systems can change it. The tool lets you set the root explicitly — converting against the real root of your project beats assuming the default.

Why prefer rem over px at all?

Accessibility and consistency: rem values scale when a user raises their base font size, while px stays fixed. Browsers also enforce minimum font sizes, which px-based layouts handle badly.

Does it convert both directions in one go?

Yes — paste a list and see px and rem side by side. Ideal when migrating a legacy px stylesheet to rem incrementally.

px / rem converter — Guide

Convert a batch of values between px and rem with a configurable root font size.

What it is and when to use it

Convert a batch of values between px and rem against any root font size — the 16px default or whatever your design system sets. Rems keep typography and spacing accessible (users who scale their base font size get proportional layouts), and this converter handles the whole stylesheet's worth of values in one paste.

Converts between px and rem in bulk against a root font size — for tuning responsive typography and spacing.

How to use it

Set the root font size — the font-size of the page html, 16px by default; adjust the decimal places as needed
Choose the direction: px → rem or rem → px
Enter the values (separated by spaces, commas or newlines; px and rem units are accepted)
Copy the result. The relationship is rem = px ÷ root font size

A worked example

Fill in root size 16

Copy this into the tool, or open px / rem converter

Things that trip people up

A wrong root font size shifts every result, so keep it in sync when you change the design baseline

Questions people ask

What root font size should I assume?: Browsers default to 16px, but users and design systems can change it. The tool lets you set the root explicitly — converting against the real root of your project beats assuming the default.
Why prefer rem over px at all?: Accessibility and consistency: rem values scale when a user raises their base font size, while px stays fixed. Browsers also enforce minimum font sizes, which px-based layouts handle badly.
Does it convert both directions in one go?: Yes — paste a list and see px and rem side by side. Ideal when migrating a legacy px stylesheet to rem incrementally.

Next steps

Open the px / rem converter tool

Spotted something wrong on this page? Tell us via Contact Us