Interview Question

What is prefers-reduced-motion?

prefers-reduced-motion lets CSS reduce non-essential movement.

💡 Concept ✅ Quick Revision 🎨 CSS

Answer

prefers-reduced-motion is a media feature for users who request less non-essential motion. • A reduce match should remove or simplify movement that may cause discomfort. • It does not require removing every state change. • Essential information must remain available without animation.

💡 Simple Example

@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto; animation-duration: .01ms; } }

⚡ Quick Revision

prefers-reduced-motion lets CSS reduce non-essential movement.