Concepts

Understanding fluidity's math model, the three easing curves, and the configuration custom properties that scope and tune every ramp.

Fluidity scales CSS properties across viewport or container size using pure CSS calc(). This section breaks down how the math works and explains the three curve types: linear, exponential, and logarithmic, with guidance on when to reach for each. It also shows how to configure the scaling bounds and curves for your design.

These concepts apply identically across all 11 utility families.

How It Works

The clamp model, progress formula, and a worked numeric example.

Curves

Linear, exponential, and logarithmic ease functions: when to use each.

Configuration

Custom properties and setter utilities that control scaling bounds, curves, and axis.