<div dir="ltr">Most operating systems offer an accessibility setting to reduce motion:<br><a href="https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-reduced-motion#User_preferences">https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-reduced-motion#User_preferences</a><br><br>The `prefers-reduced-motion` media query reflects these settings, and over the last view versions, we have started honoring this in the Firefox UI. We started with replacing the old `toolkit.cosmeticAnimations.enabled` pref, and then expanded support beyond that. This work is ongoing and tracked here: <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1478597">https://bugzilla.mozilla.org/show_bug.cgi?id=1478597</a><br><br>Going forward, when you add a motion animation, please ask yourself whether it should honor `prefers-reduced-motion`. WCAG's level AAA success criterion is a good starting point: "Motion animation triggered by interaction can be disabled, unless the animation is essential to the functionality or the information being conveyed." Read more on this here: <a href="https://www.w3.org/WAI/WCAG21/Understanding/animation-from-interactions.html">https://www.w3.org/WAI/WCAG21/Understanding/animation-from-interactions.html</a><br><br>The key question is whether your animation could trigger vestibular disorder reactions (roughly translates to what a layperson would call motion sickness). If your motion animation is essential, consider offering a different or simpler animation to support reduced motion, rather than using the original animation unmodified or removing it altogether. For instance, we got reports that the tabs' spinning loading icon is problematic for some users, so in Nightly we now use a static loading icon for reduced motion. We currently think this works well, but since the icon isn't animating at all, there's a minor concern that the UI could look stalled or hung when a page takes a long time to load without feedback, so we might end up adding a simplified animation for that icon (<a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1650028">https://bugzilla.mozilla.org/show_bug.cgi?id=1650028</a>).<div><br></div>There's no strictly enforced rule that all motion animations must support this, but we do have a general commitment to accessibility. If you added an animation and see users complain about it in a way that could indicate it being a trigger for vestibular disorder reactions (rather than there being an aesthetic disagreement), please take those complaints seriously. When in doubt, please consult #accessibility.<br><br>Additional note, if you work in <b>browser.xhtml</b>: Instead of looking at `prefers-reduced-motion` through standard APIs, you may want to use the `gReduceMotion` helper. Except for being conveniently shorter than `window.matchMedia("(prefers-reduced-motion)").matches`, this helper is also always `false` for the first second or so when a new browser window is opening, regardless of underlying settings. This can be useful if your animation could degrade window opening performance.<br><br><div>Let me know if you have questions.</div><div><br></div><div>Regards,</div><div>Dao<br></div></div>