REM to PX Converter

An easy to use rem to px converter tool for web designers.

The tool by default does conversions based on the 16px as the root (<html>) font size, which is default of most modern web browsers. But if you are using different root font-size, you can change it above.

Live Preview

Font Size = 1rem & Base Font Size = 16px

[Sample Text]

Loved the tool? Add to your bookmarks (press Ctrl/Cmd + D)

OR

Add as extension in your browser

available in chrome web store button

How to Use Our REM to PX Converter & All Its Features?

Simply enter the rem value you want to convert in the REM input box and the tool will convert it into pixels automatically and instantly as you type the value. No extra clicks required!

Also, this is a two way rem ⇄ px converter tool. So, feel free to enter the px value in the pixels input box to get its rem conversion. Alternatively, you can use our dedicated PX to REM converter, which also works both the ways.

And, for your reference this tool also shows you the live text preview of the px font-size, so you can also test the font-size right on this page using this tool to save your time.

Common REM to PX Conversions

As per base (root font size of HTML) - 16px.

RemPixels
0.15rem2.4px
0.1875rem3px
0.25rem4px
0.375rem6px
0.45rem7.2px
0.5rem8px
0.62rem9.92px
0.625rem10px
0.65rem10.4px
0.75rem12px
0.8rem12.8px
0.875rem14px
0.93rem14.88px
0.9375rem15px
1rem16px
1.07rem17.12px
1.125rem18px
1.2rem19.2px
1.25rem20px
1.3rem20.8px
1.375rem22px
1.4rem22.4px
1.5rem24px
1.625rem26px
1.75rem28px
1.8rem28.8px
1.875rem30px
2rem32px
2.25rem36px
2.375rem38px
2.5rem40px
2.625rem42px
2.68rem42.88px
2.75rem44px
2.875rem46px
3rem48px
3.25rem52px
RemPixels
3.4rem54.4px
3.5rem56px
3.84rem61.44px
4rem64px
4.16rem66.56px
4.32rem69.12px
4.48rem71.68px
4.5rem72px
4.72rem75.52px
4.8rem76.8px
4.96rem79.36px
5rem80px
5.12rem81.92px
5.28rem84.48px
5.44rem87.04px
5.6rem89.6px
5.76rem92.16px
5.92rem94.72px
6rem96px
6.08rem97.28px
6.24rem99.84px
6.4rem102.4px
6.56rem104.96px
6.72rem107.52px
6.88rem110.08px
7.04rem112.64px
7.2rem115.2px
7.36rem117.76px
8rem128px
8.75rem140px
10rem160px
12rem192px
60rem960px
64rem1024px
80rem1280px
100rem1600px
120rem1920px

To do conversions for other rem, px or base values use the tool above.

How do you calculate REM to PX?

The formula to calculate PX from REM is:

px = rem x base font-size of root <html> tag

Example Calculation:

Suppose you want to calculate px value of 1 rem, then as per the formula above, you have to multiply 1 with the base font-size.

If the base font-size is 16px, then 1 multiplied by 16 is 16.

Hence, 1rem is equals to 16px.

This REM to PX converter tool does calculations using the same formula and allows you to convert rem to px in much fast and easy way than doing this calculation manually.

When to use px em rem?

px, em, and rem are all units of measurement used in CSS by UI/UX developers for defining sizes and dimensions of various elements on a webpage.

Pixels (px) is an absolute unit of measurement that is fixed to a specific size on a screen. Using px is much easy and straightforward to define precise sizes, such as for borders, text, and images.

However, it does not scale with different screen sizes and may not be as accessible for users who have vision impairments or who need to enlarge text.

Em-height (em) is a relative unit of measurement that is based on the font size of the parent element. When the font size of the parent element changes, the font-size of the child elements with em units will also change accordingly.

Not limited to fonts, the em unit is also commonly used to define padding and margin of the sections and divs on the webpage. It helps create responsive designs that can adjust to different screen sizes and accessibility needs.

Read more about em on our pixel to em converter page.

Rem (root-em) is also a relative unit of measurement but is based on the font size of the root element (the <html> tag).

Like em, it is also used to define font sizes, padding, and margins, but the main difference between them is rem is not affected by the font size of the parent element. This makes it easier to use and more predictable than em when designing responsive layouts.

To summarize, px is usually used for fixed size elements, while em and rem are used for elements that you want to adjust automatically with different screen sizes. When choosing between em and rem, consider whether the size you are defining should be affected by the font size of the parent element or not.

RELATED TOOLS: