AsheeUI is a React component framework for Tailwind CSS v4. It ships the components a
product is made of, not a button and a card, but the page compositions, the field family,
the four states every region can be in, and the two tables, behind one configuration
cascade and one theme controller. The same descriptions render on the web and on React
Native.

## The shortest path

```bash
npm install asheeui
```

Then two imports and a provider:

```tsx
// src/index.css
@import "tailwindcss";
@import "@asheeui/web/styles";
```

```tsx
// src/main.tsx
import { AsheeUIProvider } from "@asheeui/web";

createRoot(root).render(
  <AsheeUIProvider>
    <App />
  </AsheeUIProvider>,
);
```

That is the whole setup: no bundler plugin, no generated file, no configuration file. Every
page in this documentation builds on it.

## Where to go next

| If you want to… | Read |
| --- | --- |
| Add it to an existing application, in order | [Installation](/getting-started/installation) |
| Render your first component | [First component](/getting-started/first-component) |
| Understand the configuration | [Configuration](/concepts/configuration) |
| Change the colours, or add a theme | [Theming](/concepts/theming) |
| Find a component | [Components](/components) |
| Build a whole page | [Page compositions](/guides/page-compositions) |
| Run it on a device | [React Native](/platforms/native) |
| Scaffold and check a setup from the terminal | [CLI](/getting-started/cli) |

## What it is not

It is not a design system you restyle: the tokens are the framework's, and an application
overrides the ones it disagrees with. It is not a CSS framework: it is Tailwind's, already
configured. And it is not a page builder, though it can sit behind one, see
[Puck](/platforms/puck).
