Instantly convert REM units to Pixels (px) for web design.
| REM | Pixels |
|---|
In web development, REM (Root Em) is the standard unit for scalable typography and layout. However, sometimes you need to know the exact pixel value of a REM unit for precise adjustments or to match a legacy design spec. This tool allows you to instantly convert any REM value back to pixels based on your root font size.
Unlike fixed pixel values, REMs scale relative to the root HTML font size (defaulting to 16px). This calculator helps you verify that your responsive units align perfectly with your design requirements.
The math is straightforward:
Pixels = REM × Base Size
If your base size is the standard 16px, then 2rem equals 32px (2 × 16). If you are using the "62.5% trick" (where base size is 10px), then 2rem equals 20px. You can adjust the Base Size in the tool above to match your project.
For almost all modern browsers (Chrome, Firefox, Safari, Edge), the default root font size is 16px. This is why 1rem typically equals 16px unless changed in CSS.
Yes! CSS fully supports decimal REM values like 0.875rem (14px) or 1.5rem (24px). This allows for fine-grained control over spacing and sizing.
Absolutely. Tailwind uses REMs by default (e.g., w-4 is 1rem). If you are customizing your Tailwind config or trying to match a specific pixel value, this converter is essential.