All tools · page 263

Paste directional layout intent to get logical-property CSS that mirrors automatically for RTL locales.

Paste physical CSS to get a mapping table converting margin-left and friends to logical properties.

Pick dense or row flow to get grid-auto-flow CSS with packing behavior explained.

Set colors and duration to get shimmer-sweep skeleton loading CSS for cards and text lines.

Set size, thickness, and color to get border-based spinning loader CSS.

Set dot count and stagger to get bouncing dots loader keyframes with spacing math.

Set travel distance to get back-and-forth indeterminate progress bar keyframes.

Set origin side and thickness to get scaleX underline hover transition CSS for nav links.

Set reveal threshold to get animation-timeline view() scroll-driven entrance CSS with a no-JS fallback.

Set colors to get scroll-driven reading progress bar CSS using scroll-timeline with a fallback.

Set layer speeds to get scroll-driven translateY parallax CSS with depth order warnings.

Set item count and step to get nth-child animation-delay stagger CSS for list entrances.

Set scale and pan duration to get Ken Burns slow zoom keyframes for hero imagery.

Set ring color and period to get pulsing notification badge keyframes.

Set digit count and duration to get odometer-style rolling digits CSS with the column markup.

Set width and side to get off-canvas drawer CSS with a checkbox or target toggle markup.

Set content heights to get grid-template-rows 0fr to 1fr smooth accordion CSS.

Set durations to get dialog open fade and scale entrance CSS using the open attribute.

Set enter, hold, and exit durations to get toast keyframes with dismiss pacing advice.

Enter a percentage to get SVG ring progress with stroke-dasharray math and CSS variables.

Pick a named easing to get its cubic-bezier value with a plain-language motion description.

Drag control points to get a cubic-bezier value with overshoot warnings and sample keyframes.

Set bounce intensity to get the closest spring-like cubic-bezier approximation with duration advice.

Set distance and direction to get icon nudge-on-hover transition CSS for links and buttons.