Fluid responsive styling (UnoCSS, container queries)
Generated from
mcp/patterns.registry.json— do not edit by hand; change the registry and runbun run patterns:build.
Index card — the docs below are the canonical explanation; deep-tier pattern pages additionally carry invariants and emulation notes.
Category: UI Components & Design System · Tier: light · Risk: low — frontend only
A UnoCSS-driven mobile-first strategy combining clamp()-based fluid typography/spacing, media-query breakpoints for page layout, and container queries for self-contained component responsiveness.
When to use: Apply when a component or page needs to scale smoothly across viewport sizes or respond to its own container rather than the viewport.
Docs
Code
Machine-readable record: ui-fluid-styling in mcp/patterns.registry.json.