b2KIT

PX to REM Converter

Convert pixel values to rem units and vice versa with customizable root font size base value.

Tested tool guide Tested browser tools Checked August 16, 2026

What PX to REM Converter does, with a checked example

Enter a length in either unit and this tool returns its equivalent in the other, scaled by a root font size you can adjust (16px by default, the browser's standard). Pixel values are divided by the base to produce rem; rem values are multiplied by it to produce px, so the conversion is exact in both directions and recomputes live as you type. The result is a plain CSS-ready number. The surprise most users hit: the base is not a constant. A site that sets html { font-size: 62.5%; } makes 1rem equal 10px, so converting with the default 16px silently produces wrong sizes.

Worked example

A concrete input and expected output from the current implementation.

Input

48px (root font size left at 16px)

Expected output

3rem

Each rem equals the root font size, so the tool divides 48 by 16. The same input with the base set to 10px would return 4.8rem.

How the result is produced

1

Two arithmetic directions

The conversion is a single division or multiplication: rem = px / base, px = rem * base. Entering a pixel value divides it by the root font size; entering a rem value multiplies. Results update as the input or the base changes, and values with fractional rems (0.875rem, 1.375rem) are ordinary output because CSS accepts any decimal rem.

2

The base value

The base defaults to 16px, matching the browser's default root font size, but the tool lets you set any value because the real root size is a site decision. Projects frequently set html { font-size: 62.5%; } so 1rem equals 10px, or size the root with a fluid clamp(). Set the base to what the target project actually uses, or every result will be wrong for that stylesheet.

Good uses

  • You have pixel measurements from a design file or screenshot and want stylesheet declarations in rem (font sizes, paddings, gaps) that scale with the root font size.
  • You are reading existing CSS that uses rem and want to know the exact pixel size a value resolves to at the project's root font size, such as 1.5rem becoming 24px.
  • You are converting for a project that does not use the default root size, for example the 62.5% trick or a fluid html font-size, and you set the base to that project's real value first.

Limits and checks

  • Every result depends on the base you entered. If the site's actual root font size differs, whether from a breakpoint or a clamp() that varies with viewport, the rem value you paste will not resolve to the pixel size shown.
  • rem is not em. em resolves against the font size of the parent element, so a rem value converted at a 16px base means something else entirely inside a container with its own font-size.
  • In media queries, rem units resolve against the browser's initial font size (16px), not the html element's custom size, and users can change their default font size or zoom. The tool converts numbers; it cannot guarantee what the browser will render.

Common questions

Why does the tool default to 16px?

16px is the root font size most browsers use unless a page overrides it, which is why the rem unit was designed so that 1rem equals 16px by default. The default is only a starting point: what matters is the font-size your target project sets on its html element, and the base field exists for exactly that.

Can I use the fractional results like 0.875rem directly in my CSS?

Yes. CSS accepts any decimal rem value, so 0.875rem or 1.375rem are perfectly valid declarations, and decimals like these are exactly what you get when a pixel value does not divide evenly by the base. Nothing further needs rounding; the browser computes the final pixel size itself.

References and verification

The example and behavioral notes were checked against the browser implementation. Standards and primary references below define the relevant format, formula, or platform behavior.

Related Tools

JSON Formatter & Validator

Format, validate, and beautify JSON with syntax highlighting and error detection.

Base64 Encoder / Decoder

Encode text or files to Base64 and decode Base64 strings back to their original form.

SQL Formatter & Beautifier

Format and indent SQL queries for better readability across all major dialects.

HTML to Markdown Converter

Convert HTML markup into clean Markdown syntax with support for tables and lists.

Markdown to HTML Live Preview

Write Markdown and see the rendered HTML output in real time with live preview.

Diff / Patch Viewer

Visualize unified diffs and patch files with color-coded additions and deletions.