Update frequency media query
The update media query describes how frequently the output device can update the rendered view. It can help tailor motion or visual complexity to slower or less dynamic display contexts.
Overview
The update media query describes how frequently the output device can update the rendered view. It can help tailor motion or visual complexity to slower or less dynamic display contexts.
Browser support
| Feature | Desktop | Mobile | ||||
|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Chrome Android | Safari iOS | |
| 113 | 113 | 102 | 17 | 113 | 17 | |
1+Supported (version) Not supported ※Has note Sub-feature descriptions sourced from MDN Web Docs (CC BY-SA 2.5)
Syntax
CSS
@media (update: slow) {
* { animation: none !important; }
}
@media (update: none) {
.animated { display: none; }
}Live demo
Use cases
Display-aware motion tuning
Reduce animation complexity when the output cannot update fluidly.
Static output adaptation
Adjust presentation for print-like or slow-refresh environments where animation would not make sense.
Cautions
- This is an environment hint, not a replacement for broader reduced-motion support.
- Only specialized interfaces usually need to branch on update frequency directly.
Accessibility
- Reducing unnecessary motion can support users sensitive to animation and visual instability.
- If motion is important to understanding, provide a non-animated equivalent as well.
Related links
Powered by web-features