Prisma saystransition animates a property smoothly between two values over a duration.
transition: background .3s ease animates background changes over 0.3s. List property, duration, timing function, and optional delay. Transitions fire on state changes. Animate cheap properties (transform, opacity) for smooth 60fps; avoid animating layout properties.
Power-ups you unlock
transition: property duration timing delay
Fires on state change (hover, class toggle)
Animate transform/opacity for smoothness
transition:all is convenient but wasteful
Jank the Janitor attacks — common mistakes
Animating width/height/top (janky reflows)
transition on :hover instead of the base state
Forgetting a duration (no visible animation)
Boss battleAdd a smooth color + transform transition to a button on hover.