Motion & Feel

Reduce Motion

When the user asks for reduced motion, replace positional slides/springs with fades, drop parallax and z-axis/blur animation, and keep opacity/color changes that aid comprehension.

@media (prefers-reduced-motion: reduce) → a sheet fades in instead of sliding up.

Default: slides in 40px

One of 220 cards in the Apple HIG deck. Browse every card.