Convert px to rem or em and back at any base font size, one value or a whole list. Runs on your device.
Going from px to rem, the page divides by the base font size: rem = px ÷ base. At the usual base of 16 px, 24 px is 24 ÷ 16 = 1.5 rem, and 12 px is 0.75 rem. Going from rem to px it multiplies: px = rem × base, so 1.5 rem is 24 px. Em uses exactly the same arithmetic. Only the meaning of the base changes. Results are rounded to 4 decimals and trailing zeros are dropped, so 1 px at a base of 16 is 0.0625 rem, and 1 px at a base of 3 is 0.3333 rem. The formula box shows the first 5 values worked out in full.
For rem, the base is the font size of the root element, the html tag. Browsers start with 16 px, but a person can change the default size in browser settings, and rem values then grow or shrink with it, which is the reason many sites size text in rem. If your stylesheet sets html to 62.5%, which is 10 px, type 10 as the base. For em, the base is the font size the em refers to: for the font-size property it is the parent element's size, and for other properties such as padding or width it is the element's own font size. Type that size as the base to get the em value.
The first box takes one number or a list. Numbers may be separated by spaces, new lines, semicolons or commas, so 12 16 24, 12, 16, 24 and 12;16;24 all work. A unit stuck to a number, such as 16px or 1.5rem, is ignored. A comma inside a number is read as a decimal comma, so 1,5 is 1.5, and 1,250 is 1250. You can enter up to 100 values in 1,000 characters, each no larger than 1,000,000 in size, and negatives are fine. Anything that is not a number shows a message under the box and no answer, and the message never repeats what you typed.
Under the answer, a table lists 15 common pixel sizes from 8 to 64 px (8, 10, 12, 14, 16, 18, 20, 24, 28, 32, 36, 40, 48, 56 and 64) at the base you set. Change the base to 10 and the 16 px row becomes 1.6 rem. The table uses rem for the rem directions and em for the em directions. Nothing you type is stored or sent; the page works out the answer in your browser.
Divide the pixels by the root font size. With the usual 16 px base, 24 px ÷ 16 = 1.5 rem. For rem to px, multiply: 1.5 rem × 16 = 24 px. Set the base box if your site uses another root size.
Use the font size of your html element. Browsers default to 16 px. If your CSS sets html { font-size: 62.5% }, the root is 10 px and the base to type is 10. For em, use the size that the em is measured against.
The arithmetic is the same, px ÷ base. The difference is the base: rem always uses the root element's font size, while em uses the font size of the parent for font-size and of the element itself for other properties. You choose and type the base.
Yes. Type them separated by spaces, commas, semicolons or new lines, such as 12 16 24. The answer shows them joined, and a block under it lists one line per value like 12px = 0.75rem. The limit is 100 values.
At a base of 16, 1 ÷ 16 is exactly 0.0625. Results are rounded to 4 decimals, so a value such as 1 ÷ 3 appears as 0.3333. Browsers handle more decimals than that, so the rounded figure is fine to paste.