OSS Tanbou

build custom React interfaces from unstyled accessibility primitives for dialogs, menus, comboboxes, and other UI patterns

About these scores

OSS scale score is an unbounded metric that log-compresses and weights Stars, Watchers, Forks, and Contributors. Discovery score is the current OSS scale score minus the score at discovery. Update pace is commits in the last 30 days, growth momentum is the OSS scale score difference within the recent observation window, and OSS health is a 0–100 rating based on available recency, Community Health, and release data.

Stars
8,623
Primary language
TypeScript
Repository last updated
Oct 3, 2026
On this page

Overview

Ariakit provides unstyled React components and hooks for building accessible web interfaces. Dialog, Menu, Combobox, Select, Popover, Tabs, and other interactive patterns are exposed as lower-level primitives so teams can keep their own CSS and design system while reusing interaction and accessibility foundations.

Features and best fit

Based on official documentation; not hands-on tested · Content checked:

Key features

Provide primitives for common interactive UI patterns

@ariakit/react exports Button, Dialog, Menu, Combobox, Select, Popover, Tab, Tooltip, and related primitives that can serve as the behavioral and accessibility foundation for application components.

Sources: [3][2]

Compose unstyled components into an existing visual system

Ariakit is designed as a lower-level component toolkit rather than a fixed visual library, allowing teams to keep their own branding and design tokens while reusing interaction primitives.

Sources: [2][1]

Import components through focused package exports

The @ariakit/react package exposes subpaths for button, dialog, menu, combobox, select, popover, tabs, and other areas so applications can organize imports around the primitives they use.

Sources: [3]

Best fit

Fits teams building a custom React design system or component library

It is a strong fit when a frontend team wants to control visual design, layout, and animation while starting from primitives intended for accessible interaction.

Sources: [2]

Before adoption

Visual design and application-specific UX remain the adopter's responsibility

Because the primitives are unstyled, spacing, color, responsive behavior, and animation still need to be designed and implemented by the application. Ariakit does not provide a finished visual system by itself.

Sources: [2]

Check the current React guidance for new installations

The current Ariakit React getting-started guide says React 18 or later, while package peer dependencies currently allow React and ReactDOM 17, 18, or 19. New projects should validate the documented path against their actual framework and React version.

Sources: [2][3]

Do not treat the entire monorepo as a single MIT-licensed codebase

The repository README explicitly documents different licenses by path. Packages and ordinary examples are MIT, Plus examples use the Ariakit Plus License, and the app directory is proprietary, so reuse should be checked at the path being consumed.

Sources: [1][4]

Official sources

  1. [1]Ariakit repository README(2026-10-03)
  2. [2]Ariakit React Getting Started(2026-10-03)
  3. [3]@ariakit/react package metadata(2026-10-03)
  4. [4]@ariakit/react MIT license(2026-10-03)
Supplemental curator note

Ariakit fits teams that want accessibility-oriented primitives without adopting a fixed visual design system. The monorepo is not covered by one license, so verify the license for the specific package, app code, or example you plan to reuse.

Try it in 3 steps

  1. 1

    Install @ariakit/react 0.4.40

    Add Ariakit React to an existing React project. The current getting-started guide recommends React 18 or later for new use.

    npm install @ariakit/react@0.4.40
  2. 2

    Import an Ariakit primitive

    Start with a small primitive such as Button and integrate it into the existing component structure.

    import { Button } from "@ariakit/react";
  3. 3

    Render the unstyled Button

    Verify the interaction foundation, then apply project-specific CSS or design-system styling.

    <Button>Continue</Button>
Check the official README

Growth

Growth trends · Last 30 days

8,623 Stars

Trend data is still being collected.

Development activity

Last 90 days · weekly

Commits (last 30 days)
226
Open PRs
5

Development activity is still being collected.

Built with

Categories and tags

GitHub data

GitHub dataView detailed GitHub data

GitHub Topics

  • react
  • components
  • a11y
  • accessibility
  • wai-aria
  • accessible
  • reactjs
  • ariakit
  • aria
  • css
  • tailwindcss
Stars
8,623
Forks
423
Watchers
47
Open issues
46
Contributors
117
Owner type
Organization
Primary language
TypeScript
Repository last updated
Oct 3, 2026
Write a related article

Share a guide or use case for this OSS in Markdown. Articles are published after administrator approval.

Report incorrect information

Tell us if any listing information is incorrect or outdated.

After reading this page, do you know what to do next?