Converter · CSS unit tool
VMIN to PX converter
px = (vmin ÷ 100) × min(viewportWidth, viewportHeight). vmin tracks the *smaller* of the two viewport axes, so elements stay proportional whether the device is portrait or landscape.
Result
120.00 px
30.77vmin × 390px ÷ 100 = 120.00px
min axis = 390px
Keyboard tip: press Tab or Shift+Tab to switch fields.
The VMIN to PX formula
Take 1% of whichever viewport axis is smaller, then multiply by your vmin value: px = (vmin ÷ 100) × min(width, height). On a 1200×800 window, 10vmin = 80px because height is the smaller axis.
Rotate the device and the smaller axis can switch, which is exactly the behavior that keeps square or circular elements balanced.
When vmin shines
Use vmin for elements that should never overflow either axis—full-bleed square hero art, modal sizing, or large display numerals on dashboards.
It is also a clean way to size things on rotating tablets and kiosks, where width and height swap frequently.
Copy-ready examples
.tile {
width: 40vmin;
aspect-ratio: 1;
}Frequently asked questions
- What is the difference between vmin and vmax?
- vmin uses the smaller viewport axis; vmax uses the larger one. vmin keeps elements contained, vmax lets them dominate the bigger dimension.
- Is vmin good for typography?
- For large display text it can be, but pair it with clamp() for predictable minimums. For body copy, rem-based sizing is safer.
- Is vmin to px converter free to use?
- Yes. UnitCraft calculators are free and run entirely in your browser.
- Does UnitCraft send my input values to a server?
- No. Calculator inputs are processed locally in the browser tab.
- Can I copy the generated CSS output?
- Yes. Each tool provides copy-ready snippets so you can paste values directly into code.