All tools · page 264

Set bob height and period to get gentle floating keyframes for illustrations and mascots.

Set per-letter delay to get wave entrance keyframes with the split-span markup.

Set timing to get @view-transition CSS for cross-document page fades with fallback notes.

List shared elements to get view-transition-name CSS pairs for seamless MPA shared-element moves.

Set orbit radius and dot count to get orbiting-spinner keyframes with rotation math.

Set speed and color to get background-size border-draw hover CSS for outlined cards.

Set size and hue count to get rotating conic-gradient border animation CSS for glow frames.

Set color and period to get pulsing box-shadow breathing keyframes for attention CTAs.

Set shake distance to get :user-invalid field shake CSS that only fires after real interaction.

Set scale and duration to get overflow-hidden image zoom hover CSS for gallery cards.

Set offset and duration to get focus-within dropdown open transition CSS without JavaScript.

Set bar height to get slide-down announcement CSS with dismissible collapse behavior.

Set direction and duration to get background-clip text wipe reveal animation CSS.

Set inset values to get clip-path hover reveal transitions for image overlays.

Pick a ratio and base size to get a modular type scale as CSS variables in rem values.

Enter font size to get max-width ch values that keep body text at a comfortable measure.

Paste column types to get font-variant-numeric CSS that aligns digits in data tables.

Enter font size and weight to get text-decoration thickness and offset pairs that clear descenders.

Set colors and sizes to get appearance-none custom checkbox and radio CSS with focus states.

Set overlap and ring width to get stacked avatar list CSS with overflow counting.

Set background and border to get inline code chip CSS with escaping guidance for backticks.

Set key labels to get kbd keycap CSS with inset shadows that read as physical keys.

Set header height to get position sticky thead CSS with a blurred backdrop divider.

Set marker styles to get summary marker CSS that replaces the default disclosure triangle.