Getting Started

Quick Start

Get from zero to a fully integrated AccessKit setup in four steps.

1 min read

This guide gets you from zero to a working AccessKit setup in a few minutes. You’ll add the provider, optionally the dev tool for development, and the accessibility widget so your users can control their experience.

If you haven’t installed the package yet, complete the Installation guide first. The steps below assume you have @accesskit/react installed and your app wrapped in AccessKitProvider.

What you’ll add

You’ll configure three pieces: the Provider (required), the Dev Tool (for development audits), and the Widget (for end-user controls). The tabbed code block below shows the exact code for each step. Copy the snippets into your layout and entry point as shown.

bash
npm install @accesskit/react

After that, run your app and open the dev tool panel to run an accessibility audit. Deploy with the widget so users can adjust contrast, spacing, and other preferences to their liking.

For more details on each piece, see Installation, Dev Tool, and Widget in the sidebar.