Skip to content
Branch: master
Find file Copy path
Find file Copy path
Fetching contributors…
Cannot retrieve contributors at this time
109 lines (85 sloc) 2.72 KB
path redirect_from

Get started

Reakit is a low level component library for building accessible high level UI libraries, design systems and applications with React.


First, make sure to have react and react-dom installed:

npm install react react-dom

Then, install reakit:

npm install reakit


Play with an example on CodeSandbox.

The code below will render an unstyled Button.

import React from "react";
import ReactDOM from "react-dom";
import { Button } from "reakit/Button";

function App() {
  return <Button>Button</Button>;

ReactDOM.render(<App />, document.getElementById("root"));

Server Side Rendering

If you need SSR support, you must wrap your app with Reakit Provider. It will generate deterministic IDs for accessibility purposes both on the server and client.

import { Provider, Button } from "reakit";

function App() {
  return (

Default styles

If you want to include default styles, you can use the experimental system feature with reakit-system-bootstrap. The code below will render a button with bootstrap-like styling.

import { Provider, Button } from "reakit";
import * as system from "reakit-system-bootstrap";

function App() {
  return (
    <Provider unstable_system={system}>

All the interactive examples in this documentation use reakit-system-bootstrap by default.


You can also use the UMD version of Reakit. Play with an example on JSBin.

<!DOCTYPE html>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <div id="root"></div>
  <!-- Peer dependencies -->
  <script src=""></script>
  <script src=""></script>
  <!-- Reakit UMD package -->
  <script src=""></script>
  <script src=""></script>
  <!-- Usage -->
    const App = React.createElement(
      { unstable_system: ReakitSystemBootstrap }, 
      React.createElement(Reakit.Button, {}, "Button")
    ReactDOM.render(App, document.getElementById("root"));
You can’t perform that action at this time.