Skip to content
My Blog

Search WPDesignVault

Try "image", "json", "schema" or "contrast". Use arrow keys to move through results.

CSS Tools

PX to REM Converter

Convert pixels to rem instantly with any base font size, see a reference table, or convert every px value in a block of CSS at once.

Runs in your browser. Nothing you enter is uploaded. Last updated
PXREMPXREM

Convert all px values in CSS

How to use

  1. Set the base font size (16 px is the browser default).
  2. Type a px value to get rem, or paste CSS into the bulk converter.
  3. Copy the result.

What this tool does

rem = px ÷ base font size. The bulk converter rewrites px values in your CSS and can leave 1 px borders alone.

Why it matters

Sizes in rem follow the user’s browser font setting, which makes layouts more accessible and easier to scale.

Frequently asked questions

What is 16px in rem?

1rem, when the root font size is the default 16 px.

rem or em?

rem is relative to the root element, so it is predictable. em is relative to the parent and compounds when nested.

REM to PX Converter

Convert rem values to pixels for any root font size, with a quick reference table.

Type Scale Generator

Build a harmonious typographic scale from a base size and ratio, preview it, and export CSS variables. Switch…

CSS Minifier

Minify CSS by removing comments and unnecessary whitespace, and see exactly how many bytes you save.

CSS Gradient Generator

Build linear, radial and conic CSS gradients visually with multiple colour stops and copy production-ready code.

CSS Box Shadow Generator

Design soft, natural box shadows with up to four layers and a live preview, then copy the CSS.