Ariakit
Toolkit with accessible components, styles, and examples for your next web app
Install / Use
/learn @ariakit/AriakitREADME
<a href="https://github.com/ariakit/ariakit/discussions"><img alt="GitHub Discussions" src="https://img.shields.io/github/discussions/ariakit/ariakit?logo=github&color=007acc"></a> <a href="https://github.com/ariakit/ariakit/releases"><img alt="GitHub Release Date" src="https://img.shields.io/github/release-date/ariakit/ariakit?logo=github&color=007acc"></a> <a href="https://npmjs.org/package/@ariakit/react"><img alt="NPM version" src="https://img.shields.io/npm/v/@ariakit/react.svg?logo=npm&color=007acc" /></a> <a href="https://npmjs.org/package/@ariakit/react"><img alt="NPM downloads" src="https://img.shields.io/npm/dm/@ariakit/react.svg?logo=npm"></a> <a href="https://bsky.app/profile/ariakit.com"><img alt="Follow Ariakit on Bluesky" src="https://img.shields.io/badge/Bluesky-0285FF?logo=bluesky&logoColor=fff"></a> <a href="https://discord.gg/WyHvnXsvMs"><img alt="Join the Ariakit Discord server" src="https://img.shields.io/badge/Discord-%235865F2.svg?logo=discord&logoColor=white"></a> <a href="https://github.com/ariakit/ariakit"><img alt="GitHub stars" src="https://img.shields.io/github/stars/ariakit/ariakit?logo=github"></a>
</div> <br>Docs
Packages
- @ariakit/react
- @ariakit/solid (experimental)
- @ariakit/tailwind (experimental)
Core Team
Licensing
This repository contains code with different licenses. Please read this section carefully.
| Path | License | Summary |
| :----------------------- | :----------------------------------------------------------- | :------------------------------------------------------------------------- |
| packages | MIT License | Permissive open-source. |
| examples (except Plus) | MIT License | Permissive open-source. |
| examples (Plus) | Ariakit Plus License | License granted to Ariakit Plus customers. |
| site | Proprietary | No license granted. |
Each of these directories contains its own license file with the full terms. Always refer to the most specific license file that applies to the code you are using.
Contributing
Follow the instructions on the contributing guide.
Browser testing
<a href="https://www.browserstack.com" target="_blank"> <picture> <source media="(prefers-color-scheme: light)" srcset="https://github.com/user-attachments/assets/661e578b-f09a-47d2-b5e1-2457451b7e54"> <source media="(prefers-color-scheme: dark)" srcset="https://github.com/user-attachments/assets/6f6e4185-9fa4-48c6-a01a-70b8a58bdca4"> <img alt="BrowserStack" height="48" src="https://github.com/user-attachments/assets/661e578b-f09a-47d2-b5e1-2457451b7e54"> </picture></a>Browser testing is provided by BrowserStack.
Related Skills
bluebubbles
334.9kUse when you need to send or manage iMessages via BlueBubbles (recommended iMessage integration). Calls go through the generic message tool with channel="bluebubbles".
node-connect
334.9kDiagnose OpenClaw node connection and pairing failures for Android, iOS, and macOS companion apps
slack
334.9kUse when you need to control Slack from OpenClaw via the slack tool, including reacting to messages or pinning/unpinning items in Slack channels or DMs.
frontend-design
82.3kCreate distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, or applications. Generates creative, polished code that avoids generic AI aesthetics.
