px
Converted values
px · rem · em · vh · vw · % — instant conversion, one-click copy
Click any result to copy · Tab between fields
Convert between all major CSS units instantly: px to rem, rem to px, px to em, px to vh, px to vw, and px to percent (%). Set a custom root font size and viewport dimensions for perfectly accurate results in any project. No signup. No ads. Just a fast, free CSS measurement tool.
All six CSS units update in real time as you type. No button press needed.
Click any result to copy it to your clipboard, ready to paste into your CSS.
Override the default 16px root font size to match your project's base configuration.
Set custom viewport width, height, and parent size for accurate vh, vw, and % calculations.
Supports px, rem, em, vh, vw, and percentage — all the units you use daily.
Fully responsive. Use it on desktop, tablet, or mobile — no installation required.
Convert design tokens from px to rem for accessible, scalable component libraries and design systems.
Translate Figma pixel values to responsive CSS units when handing off specs to engineers.
Learn the relationship between CSS units hands-on and verify homework calculations instantly.
Quickly adjust landing page dimensions and typography units for different device breakpoints.
Speed up production by converting client design files from fixed px to fluid rem/vh units in seconds.
Standardise CSS measurement conversions across a team without memorising formulas or writing scripts.
rem = px ÷ root.
Example: 24px ÷ 16 = 1.5rem. Change the root font size field above if your project uses a different base (e.g. 10px via html { font-size: 62.5%; }).
html { font-size: 10px }), then 1rem = 10px.
Adjust the "Root font size" field in the converter above to match your project's configuration.
<html> font size — it stays consistent throughout the document.
em is relative to the current element's font size, which can compound unpredictably inside nested elements.
For most sizing tasks, rem is recommended because it is more predictable and easier to reason about.
vh = (px ÷ viewportHeight) × 100.
Example: on a 900px tall screen, 450px = 50vh. Set your viewport height in the converter above for exact results.
clamp()), sticky headers, modal overlays, and any layout that must fill the screen on any device size.
px = rem × root.
Example: 1.5rem × 16 = 24px.
Select "rem" as the input unit in the converter above and enter your value — all px and other unit equivalents appear instantly.
html { font-size: 62.5%; }, making 1rem = 10px for simpler mental math.
Always update the "Root font size" field in this converter to match your project.