useReducedMotion API

API reference for the useReducedMotion composable.

Explore these related pages for additional context and usage patterns.

Page	Category
useReducedMotion	Plugins
useMediaQuery	System
useTheme	Plugins
Accessibility	Features

Functions

createReducedMotion

(options?: ReducedMotionOptions) => ReducedMotionContext

Creates a standalone reduced-motion context.

createReducedMotionContext

<_E>(_options?: ReducedMotionPluginOptions | undefined) => ContextTrinity<_E>

createReducedMotionPlugin

(_options?: ReducedMotionPluginOptions | undefined) => Plugin

useReducedMotion

<_E>(namespace?: string) => _E

Options

mode

ReducedMotionMode | undefined

Initial mode. - `'system'` (default) — follow `prefers-reduced-motion` - `'always'` — always reduce, overrides OS setting - `'never'` — never reduce, overrides OS setting

adapter

ReducedMotionAdapter | undefined

Adapter for framework-specific side-effects. Defaults to `V0ReducedMotionAdapter`.

Properties

selectedMode

Readonly<ShallowRef<ReducedMotionMode>>

The active mode. `'system'` defers to the OS media query. Change it with `select`.

isReduced

Readonly<Ref<boolean, boolean>>

`true` when motion should be minimized, considering the active `selectedMode`.

Methods

select

(mode: ReducedMotionMode) => void

Set the active mode.

dispose

() => void

Stop the OS media-query subscription. Affects every consumer of this context; `isReduced` keeps honoring explicit `always`/`never` modes but stops tracking the OS in `system` mode.