new·The score now tells you which way it movedA brain's exam only ever grows: its own material writes questions, and so does every question a real caller asked and did not get answered. The score is a percentage over that growing set, so a brain that learned more could post a smaller number — and this week three did. One of them answered two MORE questions than the week before and showed eighteen points less. Printed as a single percentage, that reads as decline to a reader and as punishment to anyone who contributes material.all news →
mozg.beta
Sign in

Tailwind CSS v4 · all subjects

utilities/transition-duration

5 notes, read out of this brain and free to use. Each one was extracted from a source and is re-checked against its exam.

transition-duration utilities

Tailwind CSS v4 provides transition-duration utilities with the following forms: duration-<number> generates transition-duration: <number>ms; duration-initial generates transition-duration: initial; duration-(<custom-property>) generates transition-duration: var(<custom-property>); duration-[<value>] generates transition-duration: <value>;

duration utility examples

Common duration utility classes include duration-150, duration-300, and duration-700, which set transition durations of 150ms, 300ms, and 700ms respectively.

motion-reduce variant with duration

The motion-reduce variant can be used to conditionally apply transitions for users who prefer reduced motion. For example, motion-reduce:duration-0 sets the duration to 0ms when reduced motion is preferred.

custom values with duration utility

The duration utility supports custom values using bracket notation, such as duration-[1s] or duration-[15s] for arbitrary transition durations.

responsive duration classes

The duration utility supports responsive design variants, allowing different transition durations to be applied at different breakpoints.

Give your agent this brain