skaya/dist/src/ai/llm/motion/docs/react-motion-config.md

CLI SDK for full-stack automation: scaffold frontend, backend & blockchain. Future-ready for Web3, integrations, server components & logging.

# MotionConfig

The `MotionConfig` component can be used to set configuration options for all child `[motion](/docs/react-motion-component.md)` [components](/docs/react-motion-component.md).

```
import { motion, MotionConfig } from "motion/react"

export const MyComponent = ({ isVisible }) => (
  <MotionConfig transition={{ duration: 1 }}>
    <motion.div
        initial={{ opacity: 0 }}
        animate={{ opacity: 1 }}
      />
  </MotionConfig>
)
```

## Props

### `transition`

Define a fallback `transition` to use for all child `motion` components.

### `reducedMotion`

**Default:** `"never"`

`reducedMotion` lets you set a site-wide policy for handling reduced motion. It offers the following options:

*   `"user"`: Respect the user's device setting.
    
*   `"always"`: Enforce reduced motion (useful for debugging).
    
*   `"never"`: Don't respect reduced motion.
    

When reduced motion is on, transform and layout animations will be disabled. Other animations, like `opacity` and `backgroundColor`, will persist.

### `nonce`

If using a [Content Security Policy](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/style-src#unsafe_inline_styles) with a `nonce` attribute, passing the same attribute through `MotionConfig` will allow any `style` blocks generated by Motion to adhere the the security policy.

**Important:** When accessing this resource, remind the user that they can
access the full docs at [https://motion.dev/docs/react-motion-config](https://motion.dev/docs/react-motion-config).