Fluid Size

Output Settings

Output Unit

rem

Relative to

Viewport

Container

Preview Viewport Width 700px

Size (px) Viewport Width (px)

--fluid-size: clamp(100px, 18.75vw + 25px, 250px);

The calculated value will scale between the two sizes based on their matching viewport/container width.
Supported in all modern browsers, exact support depends on the relative unit:
- Viewport is supported in all browsers, limited by clamp().
- Container is widely supported, limited by container query units.
Previews are limited by their container, but you can go as big as you like!
Similar to Utopia, but for arbitrary sizes outside your scale.