# Fluidity > Fluid UI scaling utilities for Tailwind CSS v4 — linear, exponential and logarithmic clamp-based scaling for every sizing and spacing utility. ## Docs - [Introduction](https://dnunez24.github.io/fluidity-tailwind): Fluidity is a CSS-only Tailwind CSS v4 plugin that scales padding, margin, sizing, and typography fluidly between a min and a max as the viewport grows. - [Quickstart](https://dnunez24.github.io/fluidity-tailwind/quickstart): Install fluidity, import it after Tailwind CSS, and ship your first fluid utility, a padding value that scales continuously with the viewport. ## Concepts - [Concepts](https://dnunez24.github.io/fluidity-tailwind/concepts): Understanding fluidity's math model, the three easing curves, and the configuration custom properties that scope and tune every ramp. - [How It Works](https://dnunez24.github.io/fluidity-tailwind/concepts/how-it-works): The clamp model behind every fluid utility, the progress formula, why tan(atan2()) replaces length division, and a fully worked numeric example. - [Curves](https://dnunez24.github.io/fluidity-tailwind/concepts/curves): Comparing and demonstrating the three available function curves in fluidity. - [Configuration](https://dnunez24.github.io/fluidity-tailwind/concepts/configuration): The custom properties and setter utilities that scope scaling bounds, tune curve sharpness, and switch the measured axis between viewport and container. ## Utilities - [Utilities](https://dnunez24.github.io/fluidity-tailwind/utilities): Every fluidity utility family, the value syntax they share, and how curve and variant support works across all. - [Padding and Margin](https://dnunez24.github.io/fluidity-tailwind/utilities/padding-and-margin): Fluid padding and margin utilities that scale continuously with the viewport or a container, in linear, exponential, and logarithmic variants. - [Gap and Space Between](https://dnunez24.github.io/fluidity-tailwind/utilities/gap-and-space-between): Fluid gap and space-between utilities for flexbox and grid layouts, scaling gutters and child spacing continuously as their container grows. - [Position and Scroll Margins/Padding](https://dnunez24.github.io/fluidity-tailwind/utilities/position-and-scroll): Fluidity's fluid positioning utilities and scroll margin/padding ramps for responsive layouts that adapt to container size. - [Sizing](https://dnunez24.github.io/fluidity-tailwind/utilities/sizing): Fluidity's fluid width, height, size, min/max bounds, and flex-basis utilities that scale responsively to viewport or container dimensions. - [Typography](https://dnunez24.github.io/fluidity-tailwind/utilities/typography): Fluid font-size, line-height, letter-spacing, and text-indent with the text, leading, tracking, and indent utilities. - [Borders & Radius](https://dnunez24.github.io/fluidity-tailwind/utilities/borders-and-radius): Fluid border-radius and border/outline widths with the rounded, border, outline, and outline-offset utilities. ## Recipes - [Recipes](https://dnunez24.github.io/fluidity-tailwind/recipes): Practical, worked patterns for building fluid interfaces with fluidity: type scales, container-scoped components, and Tailwind variants. - [Responsive type scale](https://dnunez24.github.io/fluidity-tailwind/recipes/responsive-type-scale): Build a proportional fluid type scale (headings, body text, and line height) that maintains its hierarchy across every viewport size. - [Container-based scaling](https://dnunez24.github.io/fluidity-tailwind/recipes/container-based-scaling): Scale a reusable card component fluidly to whatever column width it's placed in, using container query units instead of the viewport. - [Combining with Tailwind variants](https://dnunez24.github.io/fluidity-tailwind/recipes/combining-with-tailwind-variants): Layer dark mode, hover states, and breakpoint overrides on top of fluid utilities, which compile to ordinary Tailwind @utility rules. ## Reference - [Reference](https://dnunez24.github.io/fluidity-tailwind/reference): Generated and hand-written reference material — the complete utility index, every CSS custom property, and fluidity's documented limitations. - [Utility index](https://dnunez24.github.io/fluidity-tailwind/reference/utility-index): The complete, generated list of every fluidity utility — all 279 @utility rules, grouped by property and curve. Regenerated from index.css. - [CSS variables](https://dnunez24.github.io/fluidity-tailwind/reference/css-variables): The 5 custom properties every fluid utility reads and the 15 utilities that set them, with their defaults. Regenerated from index.css. - [Limitations](https://dnunez24.github.io/fluidity-tailwind/reference/limitations): What fluidity deliberately doesn't validate or support, and the browser baseline (Baseline Widely Available CSS) every utility requires. ## Agent resources - [llms-full.txt](https://dnunez24.github.io/fluidity-tailwind/llms-full.txt): The full Markdown of every page in one file. - [Page Markdown](https://dnunez24.github.io/fluidity-tailwind/index.md): Append `.md` to any page URL to fetch that page as raw Markdown. - [JSON API](https://dnunez24.github.io/fluidity-tailwind/api/docs/pages.json): Page index of the JSON docs API; each entry links the page's JSON and Markdown forms. Described by the OpenAPI document at https://dnunez24.github.io/fluidity-tailwind/openapi.json. - [API catalog](https://dnunez24.github.io/fluidity-tailwind/.well-known/api-catalog): RFC 9727 linkset of the APIs documented here. - [agent-readability.json](https://dnunez24.github.io/fluidity-tailwind/agent-readability.json): Manifest of every agent-facing artifact on this site. - [Sitemap](https://dnunez24.github.io/fluidity-tailwind/sitemap.xml): Every indexable page URL with its last-modified date.