Toolkit for building accessible web apps with React.
Explore website »
npm:
npm i @ariakit/react
pnpm:
pnpm add @ariakit/react
Yarn:
yarn add @ariakit/react
import { useState } from "react";
import { createRoot } from "react-dom/client";
import { Button, Dialog, DialogHeading } from "@ariakit/react";
function App() {
const [open, setOpen] = useState(false);
return (
<>
<Button onClick={() => setOpen(true)}>Open dialog</Button>
<Dialog open={open} onClose={() => setOpen(false)}>
<DialogHeading>Ariakit</DialogHeading>
<p>Welcome to Ariakit!</p>
</Dialog>
</>
);
}
createRoot(document.getElementById("root")).render(<App />);Browser testing provided by
Follow the instructions on the contributing guide.