Convert pixels and rem with a chosen base

With Pixels and REM, designers and front-end developers can tune an interface before implementation. Convert pixels and rem with a chosen base.

Convert pixels and rem with a chosen base. The tool is free in your browser and shows the result without asking you to create an account.

How to use

  1. Find the three pieces of information the form expects: the value to convert, its starting unit and the pixel base.
  2. Type the numeric value, then state whether it is given in PX or REM.
  3. Enter the pixel base used by your project, such as 16, because it sets the ratio between both units.
  4. Run the conversion to display the matching value in the result field.
  5. Clear the fields to start again, or import an accepted text file when your values already exist in a document.

Example

Using 24, PX and a base of 16, the tool converts a pixel size into its rem equivalent. Check the value shown in the result area, then change the number or base to compare other layouts without editing your stylesheet.

Input

24
PX
16

Output

24px = 1.5rem

Limits and formats

Where processing happens

All calculations run inside your browser. The value, unit and base stay on your device while you work, and no account is needed.

Frequently asked questions

What base should I use when my project is not based on 16 pixels?

Use the base actually defined in your project, because the conversion depends on that number. If different sections use different bases, repeat the operation for each one. Copy the result only after confirming which base applies to the element you are adjusting.

Can I convert a whole list of values at once?

The form shows one input and one result area for the conversion. You can import a supported text file or repeat the operation for each value. Review every converted number before placing it into a stylesheet or design file.

Does the tool round the converted value for me?

It displays the conversion based on the value and base you enter. If your project has a rounding rule, apply it to the result yourself. Check the final number before using it in a layout where precision matters.

Tools in the same category