How the viewport unit converter works
Divide the pixel value by the relevant viewport dimension and multiply by 100. One vw equals one percent of viewport width, while one vh equals one percent of viewport height.
vw = px ÷ viewport width × 100VH uses viewport height; vmin uses the smaller dimension; vmax uses the larger dimension.
Convert 32px in a 1440 × 900 viewport
32px equals about 2.2222vw, 3.5556vh, 3.5556vmin, or 2.2222vmax at that viewport size.
Copyable code examples
Use these examples as a starting point, then match the values and assumptions to the rendered project.
.element { width: 2.2222vw; } /* 32px at 1440px */.element { padding: clamp(1rem, 2.2222vw, 2rem); }Using the result accurately
Treat the result as context-specific. For resilient typography and spacing, combine viewport units with rem and safe limits instead of assuming one viewport size.
Viewport dimensions change across devices, window sizes, orientation, zoom, scrollbars, and mobile browser UI. New small, large, and dynamic viewport units can behave differently from the default units.
References: W3C CSS Values and Units Level 4: viewport-percentage lengths.