Convert between px, rem, em, percent, pt and viewport units with a configurable root font size. Type into any field and the others update as you go, set the parent font size for em math, and read a conversion table for common sizes.
Everything runs locally in your browser. Your data never leaves your device.
source
Conversion context
The font size on the html element. Drives rem. Browsers default to 16px.
The font size of the element's parent. Drives em.
What 100% refers to. Use the parent font size for font sizes, or a container width for widths.
Drives vw. 1vw is 1% of this width.
Drives vh. 1vh is 1% of this height.
Digits after the decimal point, 0 to 6. Trailing zeros are trimmed.
Common sizes
Common px values at a 16px root font size. Click a value to copy it.
px
rem
em
pt
About the CSS Unit Converter
This tool converts CSS sizes between px, rem, em, percent, pt and the viewport units vw and vh. Type into any field and the other six update as you type, so you can go from px to rem just as easily as from vw to pt.
Relative units only mean something in context, so you set that context yourself: the root font size for rem, the parent font size for em, the size that 100% refers to, and the viewport dimensions for vw and vh. The defaults match a normal browser setup with 16px fonts and a 1920 by 1080 viewport.
What you can do
Convert px to rem and rem to px at any root font size.
Convert px to em using the parent font size instead of the root.
Turn percentages into px by setting what 100% refers to.
Convert pt to px and back using the CSS ratio of 96px per 72pt.
Convert vw and vh to px for any viewport size, like 1920 by 1080 or a phone screen.
Read a px to rem chart of common sizes from 1px to 96px, ready to copy.
Copy any value with its unit attached, like 1.5rem or 150%.
How to use the CSS Unit Converter
1Check the conversion context. Adjust the root font size if your CSS changes it, for example the 62.5% trick that makes 1rem equal 10px.
2Type a value into the field of the unit you have. The other fields fill in as you type.
3Pasting a value with its unit works too, so 1.5rem in the rem field is read as 1.5.
4Copy the converted value you need. The copy button includes the unit, ready for your stylesheet.
5Use the common sizes table when you are converting a whole scale, and click any value to copy it.
rem, em and percent are not the same
A rem is always measured against the font size of the html element, no matter how deeply an element is nested. An em is measured against the element's parent font size, so nested em values compound. Percent depends on the property: for font-size it refers to the parent font size, while for width it refers to the containing block. That is why the tool has three separate context settings, one for rem, one for em and one for percent.
How pt and viewport units convert
CSS fixes the ratio between points and pixels: one inch is 96px and also 72pt, so 1pt is exactly 4/3 px and 12pt equals 16px. Viewport units are percentages of the viewport, so 1vw is 1% of the viewport width and 1vh is 1% of its height. Set the viewport fields to the screen you are targeting to see what a vw or vh value really measures there.
For physical and everyday measurements like centimeters, inches or miles, use the Unit Converter instead.
Convert numbers between binary, octal, decimal, hexadecimal and any base up to 36. Type into any field and the others update as you go. Handles huge integers without losing precision and accepts 0x, 0b and 0o prefixes.
Decode Base64 to text or encode text to Base64. Paste into the top box, read the result below, and flip the direction with one click. Handles Unicode correctly, reads URL-safe Base64, and shows binary payloads as a hex dump you can download.
Convert Unix file permissions between checkboxes, octal like 755 and symbolic notation like rwxr-xr-x, all kept in sync as you edit any of them. Covers setuid, setgid and the sticky bit, and shows the matching chmod command ready to copy.
Convert a color between HEX, RGB, HSL, HSV, HWB, CMYK, OKLCH and OKLAB. Type into any field and the others update as you go, or pick the color visually. Reads CSS color syntax and keeps alpha where the format supports it.
Convert config and data between JSON, YAML, TOML, JSON5, INI, XML, CSV and .env. Type or paste on the left, pick the output format on the right, and copy the result. Includes a format button and a minify toggle.
Escape text into HTML entities or decode entities back to plain text. Choose named or numeric entities, escape only the unsafe characters or everything outside ASCII, and read the result live.