← Back to Skills
Software EngineeringEngineeringPlatinum

Creating accessible web components in Svelte.

Svelte Accessibility Designer

Svelte, SvelteKit, WCAG 2.2, ARIA

expertv5.0

Best for

  • Building accessible modal dialogs, dropdowns, and complex widgets in Svelte with proper ARIA states
  • Implementing WCAG 2.2 AA compliant forms with validation feedback accessible to screen readers
  • Creating focus management strategies for SvelteKit SPAs with client-side navigation
  • Auditing existing Svelte components for accessibility issues using compiler warnings and manual testing

What you'll get

  • Complete Svelte component with reactive ARIA states, keyboard event handlers, and focus trap implementation
  • Step-by-step accessibility remediation plan with specific WCAG criteria and Svelte-specific solutions
  • Focus management strategy for SvelteKit app with code examples for route transitions and modal handling
Expects

Svelte component code, design requirements, or specific accessibility challenges within the Svelte/SvelteKit ecosystem.

Returns

WCAG 2.2 AA compliant Svelte component implementations with proper ARIA attributes, keyboard handling, and focus management patterns.

What's inside

You are an Accessibility Engineering Specialist. You design and implement WCAG 2.2 AA/AAA compliant Svelte and SvelteKit applications, combining accessibility standards with hands-on assistive technology testing. - **Accessibility by construction**: Enforce accessibility constraints from architectur...

Covers

What You Do DifferentlyMethodologyWatch ForOutput Format Format
Not designed for ↓
  • ×Generic web accessibility advice not specific to Svelte's reactivity and compilation model
  • ×Backend accessibility considerations or server-side rendering optimization
  • ×Visual design decisions like color palettes or typography choices
  • ×Accessibility testing with automated tools like axe-core without Svelte context

SupaScore

88.7
Research Quality (15%)
9.1
Prompt Engineering (25%)
9
Practical Utility (15%)
8.65
Completeness (10%)
8.85
User Satisfaction (20%)
8.95
Decision Usefulness (15%)
8.55

Evidence Policy

Standard: no explicit evidence policy.

sveltesveltekitaccessibilitywcagariascreen-readerkeyboard-navigationa11yinclusive-designfocus-managementassistive-technologyweb-accessibility

Research Foundation: 7 sources (3 official docs, 2 books, 1 expert knowledge, 1 web)

This skill was developed through independent research and synthesis. SupaSkills is not affiliated with or endorsed by any cited author or organisation.

Version History

v5.03/25/2026

v5.5 distilled from v2 via Claude Sonnet

v2.02/26/2026

Pipeline v4: rebuilt with 3 helper skills

v1.0.02/16/2026

Initial release

Works well with

Need more depth?

Specialist skills that go deeper in areas this skill touches.

Common Workflows

Accessible Design System Implementation

Design accessible component system, implement in Svelte with proper a11y patterns, then audit for WCAG compliance

© 2026 Kill The Dragon GmbH. This skill and its system prompt are protected by copyright. Unauthorised redistribution is prohibited. Terms of Service · Legal Notice