Conversion Form

VW
CM

About the Unit

VW (Viewport Width): VW is a relative unit based on the width of the viewport (the visible area of the page in the browser). 1vw corresponds to 1% of the viewport width. This unit is extremely useful when you want to create designs that automatically adjust to the screen width, especially in responsive layouts. Using vw units allows you to set element widths that adapt fluidly to the screen size without the need for complicated media queries. For example, if you set an element's width to 50vw, it will occupy half of the screen width, regardless of the screen size or device resolution. This flexibility makes VW ideal for layouts that need to be adaptable, such as websites that work well on both mobile devices and desktops.

Pro Tip: vw → cm

Convert vw to cm for precise physical print measurements.

Quick Reference: Unit Conversion by Tens

VWCM
10vw5.08cm
20vw10.16cm
30vw15.24cm
40vw20.32cm
50vw25.4cm
60vw30.48cm
70vw35.56cm
80vw40.64cm
90vw45.72cm
100vw50.8cm
110vw55.88cm
120vw60.96cm
130vw66.04cm
140vw71.12cm
150vw76.2cm
160vw81.28cm
170vw86.36cm
180vw91.44cm
190vw96.52cm
200vw101.6cm
210vw106.68cm
220vw111.76cm
230vw116.84cm
240vw121.92cm
250vw127cm

Live Unit Preview

See how different CSS units affect the size of the box below:

10px

10rem

10em

10%

10vw

10vh

Common Mistake

For responsive layouts, use vw. For print-based measurements, use cm.

Real Code Example

/* Mobile-first card with vw → cm */
.card {
  padding: 0vw;     /* undefinedcm */
  font-size: 1.5rem;
  width: min(90vw, 40ch);
}

Frequently Asked Questions About VW

When should I use vw instead of vw?

Use vw for elements that scale with screen width.

How many vw is 1vw?

1vw = 1% of the viewport width.

Is vw affected by screen size?

Yes, it changes with browser width.

Is vw good for fonts?

Sometimes, but rem is more consistent.

Keyboard Shortcuts

  • Ctrl + C: Convert
  • Ctrl + I: Invert units
  • Esc: Reset values

More popular conversions