Unit Converter
Convert between CSS units: px, rem, em, vh, and more.
Quick Reference Table
| px | rem | em | pt |
|---|---|---|---|
| 8px | 0.5rem | 0.5em | 6pt |
| 10px | 0.625rem | 0.625em | 7.5pt |
| 12px | 0.75rem | 0.75em | 9pt |
| 14px | 0.875rem | 0.875em | 10.5pt |
| 16px | 1rem | 1em | 12pt |
| 18px | 1.125rem | 1.125em | 13.5pt |
| 20px | 1.25rem | 1.25em | 15pt |
| 24px | 1.5rem | 1.5em | 18pt |
| 28px | 1.75rem | 1.75em | 21pt |
| 32px | 2rem | 2em | 24pt |
| 36px | 2.25rem | 2.25em | 27pt |
| 40px | 2.5rem | 2.5em | 30pt |
| 48px | 3rem | 3em | 36pt |
| 56px | 3.5rem | 3.5em | 42pt |
| 64px | 4rem | 4em | 48pt |
| 72px | 4.5rem | 4.5em | 54pt |
| 80px | 5rem | 5em | 60pt |
| 96px | 6rem | 6em | 72pt |
Frequently Asked Questions
What is the difference between rem and em in CSS?
rem is always relative to the root <html> element's font size (default 16px). em is relative to the parent element's font size. rem is more predictable and avoids compounding issues.
Why is 16px the default base font size?
All major browsers set the default root font size to 16px, making 1rem = 16px. You can customize the base size in this tool to match your project.
When should I use vw and vh viewport units?
Viewport units are ideal for full-screen sections, fluid typography, and layouts that scale proportionally with the browser window.
How do I convert px to rem?
Divide your pixel value by the root font size (usually 16). For example, 24px / 16 = 1.5rem. This tool does the math instantly.
What is the quick reference table for?
The reference table shows common font and spacing sizes with their rem, em, and pt equivalents pre-calculated at your configured base font size.