Getting Started with React

Install @a11ypros/a11y-ui-components, import styles once, and start composing accessible, WCAG 2.1/2.2 compliant React components with full TypeScript support.

Looking for framework-agnostic HTML5 Web Components instead? If you are building with vanilla HTML, Vue, Svelte, Angular, Astro, or static sites without React, check out the Getting Started with HTML5 Web Components guide.

1. Install

Install the React component package using npm, yarn, or pnpm:

npm install @a11ypros/a11y-ui-components

2. Load styles

Import the design tokens and component styles once in your root layout or entry file:

import '@a11ypros/a11y-ui-components/styles';

3. Render your first React components

Getting Started

Your React accessible component library is ready!

Code

4. React Features & Integrations

  • First-Class TypeScript: All components, event handlers, and props are fully typed with exported prop interfaces.
  • Ref Forwarding: All components forward refs to the underlying DOM elements for smooth integrations with focus managers or animation libraries.
  • SSR Compatible: Fully compatible with Next.js (App Router and Pages Router), Remix, and Gatsby.

Next steps