require-reduced-motion-for-expensive-animations
Require a prefers-reduced-motion: reduce override when expensive transition or keyframe properties are used.
What this catchesโ
- layout or paint properties in
transition transition: all- expensive properties inside
@keyframes
Rule optionsโ
| Option | Default | Why |
|---|---|---|
ignoreProperties | [] | Allows explicit exceptions where a project has reviewed motion behavior. |
{
"css-performance-budget/require-reduced-motion-for-expensive-animations": [
true,
{ "ignoreProperties": ["background-color"] }
]
}