Viewport units lab
CSS Viewport Units Calculator: vh, dvh, svh, lvh
See how tall 100vh, 100dvh, 100svh, and 100lvh are in pixels on this browser, so you can choose the right viewport unit for full-height layouts and mobile browser UI behavior.
Measuring units...
Why 100vh and 100dvh differ
On mobile, 100vh can ignore browser UI, while 100dvh tracks dynamic visible space. Use svh and lvh when you need fixed small/large viewport bounds.
Pair this with what is my viewport for live pixel readouts.
vmin & vmax in practice
100vmin uses the smaller viewport dimension; 100vmax uses the larger one. They are useful for square-based UI patterns and responsive hero sizing.
