Issue 01 · Motion compliance for marketing pages

Every animation on your marketing page, audited against the WCAG criteria regulators actually pursue.

Paste a URL. Motion Panel checks the four motion-specific WCAG criteria that Lighthouse, axe, and WAVE cannot: 2.2.2 Pause, 2.3.1 Flashes, 2.3.3 Animation from Interactions, plus reduced-motion honoring. Every finding cites the criterion.

See a sample report
Live example, in your browser
Fail 2.3.1
Get started
Flashes ~4hz
Pass 2.3.1
Get started
Slow 0.28hz breathe
Motion strip on the right mirrors what your OS reduce-motion setting is doing right now.

Section 01

Who is actually pursuing this.

Every figure below is footnoted with its source. Motion Panel does not ship uncited stats.

JurisdictionMax fine
Hungary[1]€1,260,000
Spain[2]€1,000,000
Netherlands[3]€900,000
France[4]€250,000
Germany[5]€100,000
Italy[6]5% turnover
ADA web lawsuits (US, 2025)
4,928
Home-page WCAG failure rate
95.9%

Section 02

The four criteria that trigger real cases.

2.2.2 Pause, Stop, Hide

W3C spec →

Any auto-moving content that runs longer than 5 seconds needs a pause / stop / hide control.

Fail
A ticker that scrolls forever with no pause button.
Pass
The same ticker with a keyboard-accessible pause button beside it.

2.3.1 Three Flashes or Below Threshold

W3C spec →

Nothing on the page may flash more than three times per second at general or red-flash thresholds.

Fail
A hero button that pulses at 4 Hz to draw the eye.
Pass
The same button with a slow 1 Hz breathe, or no flash at all.

2.3.3 Animation from Interactions

W3C spec →

Motion triggered by scroll, hover, or click must be able to be disabled by the user.

Fail
Scroll-linked parallax that fires even when prefers-reduced-motion: reduce is set.
Pass
The same parallax gated inside @media (prefers-reduced-motion: no-preference).

Baseline: prefers-reduced-motion

W3C spec →

Every animation should degrade gracefully when the OS motion setting is set to reduce.

Fail
Full parallax and letter-by-letter reveal with reduce-motion enabled.
Pass
A simple fade, or nothing at all, under reduce-motion.

Section 03

What Motion Panel actually checks.

Server-side fetch, cheerio parse, and a targeted analysis against the exact cues that cause motion violations in Framer, Webflow, and hand-rolled marketing sites.

  1. 01@keyframes definitions inside <style> and linked stylesheets
  2. 02Inline transition / animation / transform properties on elements
  3. 03Lottie player references and *.lottie.json assets
  4. 04framer-motion, GSAP, and ScrollTrigger script imports
  5. 05<video autoplay> and <audio autoplay> without a pause control
  6. 06Scroll-linked parallax hints (data-parallax, .parallax, data-scroll)
  7. 07Marquee and infinite-loop animation-iteration-count: infinite
  8. 08Missing @media (prefers-reduced-motion: reduce) blocks
  9. 09Rapid opacity toggles suggesting flash > 3 Hz
  10. 10Long-running animations without a visible stop mechanism
  11. 11Hover-triggered scale / rotate / translate above threshold
  12. 12INP damage from heavy scroll listeners (heuristic)

Section 04

Sample report — what a customer receives.

Free tier shows the top three violations. Paid tier expands the same panel in place with every finding, a downloadable PDF, and a shareable bento dashboard.

Bento dashboard preview
example-landing.com
1 attorney flag3 violations
highWCAG 2.2.2Attorney escalate
video[autoplay]

Hero video autoplays without a visible pause control. Fails WCAG 2.2.2 for any user who cannot silence background motion.

One-line fix
Add the controls attribute or a visible pause button beside the hero video.
<video autoplay muted playsinline controls>...</video>
.marquee-row

Logo ticker uses animation-iteration-count: infinite and runs > 5s with no pause. Users cannot stop it.

One-line fix
Bind a Pause button to animation-play-state: paused on the ticker container.
.marquee-row.is-paused { animation-play-state: paused; }
criticalWCAG 2.3.3Attorney escalate
:root

No @media (prefers-reduced-motion: reduce) block was found. Scroll-linked parallax fires even for opted-out users.

One-line fix
Wrap all non-essential animations in @media (prefers-reduced-motion: no-preference).
@media (prefers-reduced-motion: reduce) { * { animation-duration: 0.01ms !important; } }
Motion-Compliance-Report.pdf
Title page · executive summary · per-violation entry · regulator appendix
Paid tier

Section 05

Frequently asked, honestly.

Does it work on Framer, Webflow, and hand-rolled sites?+

Yes. The audit fetches the rendered HTML and CSS server-side and looks for the specific motion cues that Framer, Webflow, GSAP, and framer-motion leave behind. If your site is a client-rendered SPA and the initial HTML is empty, paste the DOM snapshot into the fallback textarea and we audit that.

What if my JS runs on the client and the initial HTML is empty?+

Open DevTools, right-click <html>, choose Copy > Copy outerHTML, and paste it into the 'Or paste HTML directly' field. The audit runs on the pasted markup exactly as if we had fetched it.

Is any of this legal advice?+

No. Motion Panel surfaces WCAG 2.2 findings and cites the success criteria and regulator context. When a finding could plausibly trigger an EAA fine or ADA lawsuit we raise an attorney-escalation flag. Talk to accessibility counsel before shipping in regulated markets.

How is this different from axe or Lighthouse?+

axe and Lighthouse do not evaluate WCAG 2.3.3 because they cannot detect motion triggered by scroll or interaction, and they cannot simulate the prefers-reduced-motion state. Motion Panel focuses only on the four motion-specific criteria those tools skip.

Does it handle Webflow interactions?+

Yes. Webflow interactions compile to inline transforms and animation properties that our parser picks up. We flag any interaction that fires without a reduce-motion guard.

What happens if my client is EU-based?+

The European Accessibility Act has been enforceable since June 28, 2025. Administrative fines range from €5,000 to over €1.26M depending on the member state. Every violation shows which EAA-aligned WCAG criterion it maps to, and the attorney flag fires on the high-risk ones.


Section 06

Pricing.

Free
$0
  • — One URL audit per day
  • — Top 3 motion violations with WCAG citations
  • — Plain-English explanation and one-line CSS fix
  • — Live 12-demo motion strip that mirrors your reduce-motion state
Pro subscription
$29/mo
  • — Unlimited URL audits (10/day soft rate limit)
  • — Full violation list, not just top 3
  • — PDF report with executive summary and appendix
  • — Shareable /share/[id] bento dashboard
  • — Re-audit diff view: fixed / remaining / new
  • — Automatic attorney-escalation flags
See full pricing →

Section 07 · The audit

Audit motion compliance.

Paste a public URL. We fetch the rendered HTML, extract every motion cue, and return WCAG-cited findings. If the target is a client-rendered SPA, use the paste-HTML fallback.

Free tier: top 3 violations shown.