HyperTeamsCSS Unit Converter
Convert CSS units between px, rem, em, pt, %, vw, and vh. Calculate responsive units with custom base font size and viewport settings.
Conversion Settings
Used for rem/em/% conversions
Used for vw conversions
Used for vh conversions
Conversion Table (px to rem)
| PX | REM | Copy |
|---|---|---|
| 8px | 0.5rem | |
| 12px | 0.75rem | |
| 14px | 0.875rem | |
| 16px | 1rem | |
| 18px | 1.125rem | |
| 20px | 1.25rem | |
| 24px | 1.5rem | |
| 32px | 2rem | |
| 48px | 3rem | |
| 64px | 4rem |
How to Use CSS Unit Converter
- Enter the value you want to convert
- Select the source unit (e.g., px)
- Select the target unit (e.g., rem)
- Click Convert to see the result
- Adjust settings for custom base font size or viewport dimensions
Supported CSS Units
- px (Pixels) - Absolute unit, 1px = 1/96th of an inch
- rem (Root EM) - Relative to root element font size (usually 16px)
- em (EM) - Relative to parent element font size
- pt (Points) - Absolute unit, 1pt = 1/72nd of an inch
- % (Percent) - Relative to parent element
- vw (Viewport Width) - 1vw = 1% of viewport width
- vh (Viewport Height) - 1vh = 1% of viewport height
Common CSS Unit Conversions
- 16px = 1rem (with default 16px base font size)
- 12pt = 16px (standard font size conversion)
- 100vw = full viewport width
- 100vh = full viewport height
Why Use Relative Units?
- Better accessibility - Users can scale text with browser settings
- Responsive design - Elements scale proportionally across devices
- Easier maintenance - Change base size to update all relative values
- Consistent spacing - Maintain proportional layouts
- Works entirely in your browser - no data is sent to any server
PX to REM Conversion Formula
rem = px / base-font-sizeExample: 24px / 16px = 1.5rem