NoCharge

Read the live media query

Reduced-motion preference tester

Check whether this browser reports prefers-reduced-motion: reduce, see a live animation toggle, and read exactly what NoCharge changes when it is on.

Category: Accessibility

Bottom line: This tool reads the browser's live reduced-motion preference and shows a pulsing dot that stops when the preference is set. It also states what NoCharge changes — motion removal only, never sound or rules.

Live query

What your browser reports

The dot pulses while motion is allowed. With reduced motion on, it stays still.

What NoCharge changes when it is on

  • Button press scale transforms are removed.
  • Ambient page motion (if any) is skipped.
  • Sound, rules, difficulty, and storage are not changed.

What it does not claim

The tester reports the browser's setting and its demonstration effect. It is not a medical recommendation and does not assess photosensitivity for any person.

How it works

The status reads matchMedia('(prefers-reduced-motion: reduce)').matches. A matching CSS media query stops the demonstration dot's animation. The page listens for preference changes so the status can update without a reload.

Worked example

With no reduced-motion preference reported, the query returns false and the dot pulses. Enable reduced motion in the operating system or emulate it in browser developer tools: the query returns true, the status reports that reduction is on, and the dot stays still.

This is a two-state preference check, not an animation-speed calculation. It does not infer a percentage of motion to remove. A separate in-game choice such as Simon's Calm pattern can change that game's presentation independently of this page.

What it cannot do

  • The page cannot change the operating-system setting, inspect why you chose it, or test whether another site honors it.
  • A false result means this query did not match. It does not prove that animation is appropriate for a person; an unsupported media feature can also fail to match.
  • Motion preference is separate from audio volume, flashing-content assessment, game difficulty, and keyboard access.
  • The result is read live, not saved as a NoCharge preference or used as a health assessment.

FAQ

What does prefers-reduced-motion actually do?

It is a CSS media query that reports whether the user asked the operating system or browser to reduce motion. Sites that honor it can switch animations off without JavaScript.

What changes at NoCharge when I set it?

Transforms that scale buttons on press stop animating, and pages avoid decorative motion. Sound is unaffected, and game-specific behavior (like Calm pattern in Simon) is a separate preference.

Does this tool change my system setting?

No. It only reads the browser's live media query and demonstrates its effect. Changing the setting happens in your browser or operating system accessibility menu.

Does a non-matching query mean motion is safe?

No. It means the browser did not report prefers-reduced-motion: reduce. An older browser without support can also return a non-match. This tool does not diagnose a person or determine whether an animation is appropriate.

Embed this tool

<iframe src="https://nocharge.net/tools/reduced-motion-tester/" width="400" height="620" title="NoCharge reduced-motion preference tester"></iframe>
<p>Source: <a href="https://nocharge.net/tools/reduced-motion-tester/">NoCharge tool</a></p>

Next action

Try it with a game