Fluid CSS clamp()
css_clampGenerate fluid CSS clamp() typography and spacing values that scale linearly from a small-viewport size to a large-viewport size, with output in rem or px and computed sizes at sample widths.
Instructions
Build a fluid typography/spacing value: CSS clamp() that grows linearly from a size at a small viewport to a size at a large viewport (sizes and viewports in px), expressed in rem or px. Also returns the computed size at sample viewport widths. Web version: https://s3eidat.github.io/css-units/
Input Schema
| Name | Required | Description | Default |
|---|---|---|---|
| unit | No | Output unit. Default rem. | rem |
| maxSize | No | Size in px at the large viewport. Default 32. | |
| minSize | No | Size in px at the small viewport. Default 16. | |
| maxViewport | No | Large viewport width in px. Default 1280. | |
| minViewport | No | Small viewport width in px. Default 320. | |
| rootFontSize | No | Root (html) font size in px, for rem. Default 16. | |
| sampleViewports | No | Viewport widths (px) to compute the resulting size at. |