CSS Unit Converter
Convert between px, rem, em, %, vw, and vh with live results. Adjust root font size, relative base, and viewport to match your real layout context.
Input
Conversion updates instantly as you type.
Negative values are supported for spacing and transforms.
Context
Set the environment used for relative units.
Viewport presets
Result
Primary conversion plus all unit equivalents.
Primary Conversion
16px = 1rem
Reference Values
Common CSS units at a 16px root font size and 1440px viewport width.
| Expression | Equivalent |
|---|---|
1rem | 16px |
0.875rem | 14px |
1.5rem | 24px |
10vw at 1440px width | 144px |
50% of 960px container | 480px |
100vh at 900px height | 900px |
About This CSS Unit Converter
All conversions go through pixels as the internal base. Relative units depend on your context inputs:
- rem uses Root Font Size.
- em uses the same base value as rem in this tool, useful when component font size equals root size.
- % uses the editable Relative Base field.
- vw and vh use the viewport width and height fields.
Use this for responsive typography, spacing scales, and quick checks before writing production CSS.
Privacy & Limitations
- All calculations run entirely in your browser -- nothing is sent to any server.
- Results are estimates and may vary based on actual conditions.
Related Tools
- Meta Title Description Length Checker -- Check meta title and description length with live Google SERP preview
- URL Parser -- Parse a URL into protocol, host, path, and query
- SERP Preview Tool -- Preview how your page appears in Google search results
- Open Graph Preview -- Preview how links appear on social media
Related Tools
View all toolsUTM Link Builder
Build URLs with UTM tracking parameters
User-Agent Parser
Parse a user-agent string for quick details
URL Parser
Parse a URL into protocol, host, path, and query
Sitemap XML Generator
Generate a simple sitemap.xml from a list of URLs
Robots.txt Generator
Generate a robots.txt file with common rules
Meta Tag Generator
Generate common SEO meta tags for a page
CSS Unit Converter FAQ
How do I convert px to rem?
Divide pixels by the root font size. Example: 24px with a 16px root size equals 1.5rem.
What is the difference between rem and em?
rem is relative to the root html font size. em is relative to the current element's font size. In this tool, em uses the same editable base value so you can model your component context.
How is percent converted in CSS?
Percent values are relative to another value, such as parent width, parent height, or parent font size depending on property context. This converter lets you set that relative base directly.
How do vw and vh work?
1vw is 1% of viewport width and 1vh is 1% of viewport height. If viewport width is 1200px, then 10vw equals 120px.
Does this tool store my values?
No. All calculations run in your browser. No values are sent to a server.