Why use rem instead of px?

Rem units respect the user's browser font size preference, improving accessibility for users who increase default font size.

What is the root font size?

The root font size is the font-size on the html element, typically 16px by default in most browsers.

em is relative to the parent element's font size; rem is always relative to the root (html) font size.

Yes. Enter the viewport width or height to see exact px equivalents for vw and vh values.

Enter a value in any CSS unit and see all other unit equivalents with a custom base font size.

demo

CSS Output