Home Tools Blog About

CSS Unit Converter

In short

Convert between 23 CSS units (px/em/rem/pt/%/ch/vmin/vmax/dvw/cqw…) with property context + comparison table. Free, offline, client-side, instant.

  • Runs in your browser
  • Nothing uploaded
  • Free, no sign-up

Convert one CSS value into 23 units simultaneously - including modern dvw / dvh / svw / lvh (dynamic viewport, 2022+) and cqw / cqh (container queries, 2023+). Property-aware % conversion and real viewport detection based on your actual browser window.

Context settings

All 23 unit conversions

🛡
100% PrivateNo server uploads, ever
InstantRuns in your browser
💧
No WatermarksClean output, always
🆓
Free ForeverNo accounts, no limits

How to Use CSS Unit Converter

CSS Unit Converter · free online tool · All Tools Verse
CSS Unit Converter. Free online tool that runs in your browser.
  1. Enter a value and pick the source unit.
  2. For % conversion, pick the property context (font-size, width, or height) - they use different bases.
  3. Adjust root font-size (default 16px) for rem accuracy, and parent font-size for em accuracy.
  4. Pick a viewport preset (mobile / tablet / desktop / 4K) or override W/H - affects vw / vh / vmin / vmax / dvw / dvh / svw / svh / lvw / lvh.
  5. For container query units (cqw / cqh, 2023+), set explicit Container W/H - they default to viewport when blank.
  6. Read all 23 unit values in the comparison table. Click 📋 on any row to copy that specific value.
  7. Copy all 23 or download CSV for spreadsheet analysis.

Frequently Asked Questions

What does the CSS Unit Converter do?

It runs the css unit converter right in your browser, so you get the result instantly without uploading anything.

Is it free to use?

Yes. The tool is completely free, with no signup, no limits and no watermarks.

Does my data stay private?

Yes. Everything is processed locally in your browser, so the data you enter never leaves your computer.

Does it work offline?

Yes. Once the page has loaded you can disconnect and keep using it, since it does not rely on a server.

Do I need to install anything?

No. It works in any modern browser on desktop or mobile, with nothing to download or install.

Is there a limit on input size?

There is no fixed limit. Very large inputs simply take a little longer, since the work happens on your device.

Keep going

Related Tools

All Developer tools →

CSS Animation Generator

Generate CSS @keyframes animations - 16 presets, full duration/timing/delay/direction/fill controls, prefers-reduced-motion wrapper. Live preview.…

CSS Aspect Ratio

Generate CSS aspect-ratio with padding-top fallback, object-fit options, 16+ presets, decimal input. Live preview.…

CSS Beautifier

Beautify or minify CSS with proper nested @media/@keyframes/@supports handling, comment preservation, calc()/var() awareness. Free,…

CSS Border Radius Generator

Visual CSS border-radius with elliptical mode, 6 unit types (px/%/em/rem/vw/vh), 8 shape presets, live…

CSS Clip Path Generator

Visual clip-path builder - polygon / circle / ellipse / inset / path, 20+…

CSS Columns Generator

Generate CSS multi-column layout with column-count or column-width, gap, rule, fill, span, break-inside. Live…

CSS Cursor Generator

Browse 34 CSS cursors organized by category, with custom URL cursor builder. Live hover…

CSS Filter Generator

Generate CSS filter with 10 functions including drop-shadow, backdrop-filter mode, 8 preset combinations. Live…

CSS Flexbox Generator

Visual flexbox builder with container + per-item controls (flex-grow/shrink/basis/order/align-self) and 6 layout presets. Free,…

CSS Glassmorphism Generator

Visual frosted-glass CSS builder. 9 controls including backdrop-saturate, 6 presets, 4 background scenes to…

CSS Gradient Generator

Visual gradient builder with 6 types (linear, radial, conic + 3 repeating). 8 presets,…

CSS Grid Generator

Visual CSS Grid builder with grid-template-areas, auto-fit + minmax responsive tracks, per-item spans. 6…

Share

Embed this tool

Add this free tool to your website. Copy and paste the code: