Accessibility

Free browser toolkit for checking design screenshots with contrast analysis, vision simulation, attention heat maps, and alt text support. Includes research-based guidance and a design checklist.

High contrast and neuro-inclusion now mandatory under evolving regulations, reshaping entire design systems. Accessibility moving from checkbox to foundational architecture.

Real-time AI design assistance for accessibility checks, layout optimization, and A/B testing — while maintaining human creative control. The emerging model for AI in design workflows.

React 19 component and block library with source-owned shadcn installs, semantic design and motion tokens, keyboard support, and reduced-motion paths. Includes live previews for 105 free components and 22 blocks.

Unstyled React components for accessible interfaces and design systems. Includes composable primitives for forms, overlays, navigation, feedback, and interaction without prescribing visual styling.

Figma plugin for scanning layouts and components for accessibility issues, documenting focus order and ARIA intent, and handing annotated guidance to developers before implementation.

Figma’s technical case study on making a canvas-based editor accessible through an internal accessibility tree, Mirror DOM, selection sync, and screen-reader announcements.

Advanced palette builder from Lyft Design using perceptually uniform color scales (HSLuv/LCH). Creates accessible, predictable color systems for design systems — the tool behind thoughtful ramp generation.

Free Figma plugin for writing consistent component documentation, including usage, accessibility, content, and AI guidance. Documentation can be copied or exported as JSON or CSV.

W3C overview of the September 2026 WCAG 3 draft, explaining core and supplemental requirements, policy tags, reporting tiers, and why conformance alone does not guarantee accessible outcomes.

Learn-by-doing textbook that connects interface design, usability, accessibility, and HTML/CSS/JavaScript with the social and political context of the web. Includes cases, interviews, exercises, and code.

Practical framework for designing motion that stops safely when timing, state, or performance fails. Covers duration limits, circuit breakers, static fallbacks, monitoring, and user controls.

MCP server that lets AI assistants search curated design system knowledge, including WCAG, ARIA, W3C standards, and major public design systems.

Open-source design system from Dialpad with Vue components, tokens, icons, utilities, UI kits, and accessibility guidance. Version 10 adds composition primitives, theming, MCP tooling, and migration guides.

Stark is the leading accessibility toolkit for designers, with plugins for Figma, Sketch, and Adobe XD. It includes contrast checking, vision simulation, focus order tools, alt-text annotations, and AI-powered accessibility scanning to catch issues during the design process.

Framer plugin that audits canvas and published sites for image, alt-text, style, CMS, breakpoint, link, and performance problems. Local scans pair with live Lighthouse checks and specific fixes.

GitHub Action that scans sites and repositories for accessibility barriers, files trackable issues, and can assign findings to Copilot for proposed fixes with human review.

Open design system for government services with accessible styles, components, and task patterns backed by cross-government research. Its Frontend package provides production-ready code and guidance.

Include is a Figma plugin for adding accessibility annotations to your designs — landmarks, headings, tab order, alt text, and ARIA labels. It generates a clear annotation layer that communicates accessibility intent to developers during handoff.

Public state design system with Figma components, accessible style guidance, design tokens, and icon packages. A practical reference for teams building clear, consistent government services.

Long-form framework for matching an AI product's input and output modes to user intent, cognitive load, and environment. Includes a task audit, alignment matrix, and field template.

Public documentation for Nordhealth's production design system, covering 57 web components, 300 icons, tokens, accessibility guidance, Figma tooling, and patterns for dense clinical software.

Open-source NVIDIA design system for operational AI, robotics, and autonomous-vehicle interfaces. It ships framework-agnostic Web Components, tokens, accessibility guidance, a CLI, and MCP tooling.

Public design system for New York State services with web components, CSS utilities, design tokens, accessibility guidance, and a Figma library for agency teams.

Open-source linter that checks agent-written React interfaces against a project's components, variants, tokens, and accessibility rules. Runs after edits, in MCP clients, ESLint, or CI.

Open-source CLI and browser tools for parsing and rendering Figma .fig and .deck files. Converts HTML decks to editable Figma Slides while preserving text, vectors, layouts, fonts, and speaker notes.

Free WCAG 2.2 audit suite with browser extensions, a bookmarklet, CLI, and open-source engine. Findings include exact elements and fixes, while uncertain criteria stay in a manual-review checklist.

Primer Prism, created by GitHub's design team, helps you build cohesive and accessible color systems from a single base color. It generates consistent color scales with built-in WCAG contrast checking — essential for design system color token creation.

Generates accessible color combinations that meet WCAG contrast requirements. Instant random pairings with AA/AAA compliance indicators — useful for quickly finding accessible text/background combos.

Web-based color-system builder that starts from an image or single color, generates Oklch scales, checks contrast, and exports palettes to Figma variables, CSS, SCSS, or PDF.

Advanced palette builder with manual hue/saturation sliders supporting OKHSL/LCH color spaces, image import, contrast checks, and exports up to 24 colors. For designers who want precise control over perceptual uniformity.

Source-available library of single-file SwiftUI interactions for iOS 17+, with motion, haptics, Dynamic Type, reduced-motion support, and CLI or MCP installation. Free components use Apple frameworks only.

Research report comparing usability sessions with cognitive-disabled and general-population participants, including recruitment guidance, study design, findings, and concrete testing recommendations.

Public design system behind w3.org with documented layouts, components, scripts, and templates. Its September update adds fluid type, logical properties, cleaner markup, and more flexible spacing.

Browser-based WCAG audit tool with 46 checks split across content, design, and development. Runs locally on pages behind logins or on localhost, with 28 checks available free and optional report export.

Annual practitioner survey: Web Components gaining over React, AI unstalling stalled adoption, accessibility gap narrowed from 46% to 10%. Real benchmark data, no hype.