What it is

A set of free calculators for fluid responsive design by James Gilyead and Trys Mudford, backed by Clearleft. You define type and space scales at a minimum and maximum viewport and it emits CSS clamp() values that interpolate between them. Type, space and grid calculators included.

Why it earns a slot

Replaces a pile of breakpoint overrides with one generated block of custom properties. Paste it once and headings, gaps and padding scale continuously from phone to desktop without another media query.

Know before you commit

Copy the whole generated custom-property block rather than cherry-picking values — the scale only holds together if every step comes from the same generation.

Field notes

0 from the community

Sign in to add a field note. Reading is always open.

Loading notes…

Field check

Unverified

Sign in to confirm this entry is still accurate.

Pricing snapshot

Free

Snapshots move fast — verify at checkout, and post a field note if it changed.

Drop into your Lovable chat

Evaluate Utopia (https://utopia.fyi) for this project, then use it only if it fits what we are already building.
Context: Fluid type and space calculator. A set of free calculators for fluid responsive design by James Gilyead and Trys Mudford, backed by Clearleft. You define type and space scales at a minimum and maximum viewport and it emits CSS clamp() values that interpolate between them. Type, space and grid calculators included.
Reviewer notes (general, not written for this codebase): Replaces a pile of breakpoint overrides with one generated block of custom properties. Paste it once and headings, gaps and padding scale continuously from phone to desktop without another media query.
Watch out for: Copy the whole generated custom-property block rather than cherry-picking values — the scale only holds together if every step comes from the same generation.
Pricing: Free
Rules: treat the notes above as background only. Do not assume a theme, style, layout or feature that is not already in this project — inspect the existing code first and ask me before changing visual direction.

/api/public/tools/utopia