Back to all Tools

Pixel to REM Converter

Quickly convert CSS units between pixels and REM.

Base font size

px

Most browsers default to 16px. 1rem=1 × base font size.

Conversion

px
rem

Reference table

Base: 16px

PixelREMPixelREM

What is REM?

REM (Root EM) is a relative CSS unit based on the font size of the <html> element.

Unlike EM, which is relative to the parent element, REM is consistent throughout the document.

Advantages of REM

  • Better accessibility
  • Easier to scale
  • Consistent proportions
  • Respects browser settings

CSS example

html {
  font-size: 16px;
}

h1 {
  font-size: 2rem;    /* 32px */
}

p {
  font-size: 1rem;    /* 16px */
  margin: 1.5rem 0;   /* 24px */
}

Tips

  • Use rem for font sizes
  • px for borders and shadows
  • rem for spacing (margin, padding)
  • 62.5% trick: html { font-size: 62.5%; } makes 1rem=10px

Was this tool helpful?