# Respect "Reduce Motion" in Divi Animations

> Turns off Divi's entrance animations, parallax and scroll effects for visitors whose device asks for reduced motion, while everyone else keeps the effects.

- Type: CSS
- Runs: Site-wide header
- Category: [Accessibility](https://wpide.com/library/category/accessibility/)
- Tags: divi, reduced-motion, animation
- Author: WPIDE Team
- Installs: 0
- Updated: 2026-10-28
- Page: https://wpide.com/library/a11y-divi-reduced-motion/

## Code

```css
@media (prefers-reduced-motion: reduce) {
    .et_animated,
    .et-waypoint,
    .et_pb_animation_top,
    .et_pb_animation_bottom,
    .et_pb_animation_left,
    .et_pb_animation_right {
        opacity: 1 !important;
        animation: none !important;
        transform: none !important;
    }

    .et_parallax_bg,
    .et_pb_parallax_css {
        background-attachment: scroll !important;
        transform: none !important;
    }
}
```

## Notes

Content hidden until its animation starts is made visible immediately.

## How to use it

Install the free WPIDE plugin (https://wordpress.org/plugins/wpide/), find "Respect "Reduce Motion" in Divi Animations" in its snippet library and add it in one click; or create a new CSS snippet in WPIDE (or any code snippets plugin) and paste the code above. More snippets: https://wpide.com/library/