Transitions and Transforms

Transitions and Transforms: Transitions: Smooth Changes, Transforms: Move, Turn and Grow.

Updated

  1. Transitions: Smooth Changes (Apprentice): A transition makes a change in CSS happen smoothly over a short time instead of in one jump, so a button that changes color on hover or focus eases into its new look.
  2. Transforms: Move, Turn and Grow (Apprentice): Transforms slide, turn and resize an element with translate, rotate and scale without moving anything around it, which makes them the tool for a button that lifts, a card that tilts or a badge that grows.