---
title: Installation
description: Add arctis/ui components and blocks to your app.
group: Get Started
order: 3
---

Use the CLI to copy the pieces you need into any React app running Tailwind CSS v4.


## Add

```bash
npx @arctis-sh/@arctis-sh/ui@latest add button
```

```bash
npx @arctis-sh/@arctis-sh/ui@latest add slider pricing-01
```

The CLI writes files to `components/ui`, `components/blocks`, and `lib`, installs their npm dependencies, and keeps the `@/` imports intact.

```tsx
import { Button } from "@/components/ui/button"
```

```tsx
import { Pricing01 } from "@/components/blocks/pricing/pricing-01"
```

The peer dependencies are `react` and `react-dom` (^19).

## Theme

Define the standard tokens in your global CSS (`--background`, `--foreground`, `--muted`, `--border`, `--primary`, `--radius`, and the rest). Components read from those variables rather than shipping a complete app theme.

## Full package (optional)

If you prefer npm imports over copied files, install the full package:

```bash
npm i @arctis-sh/ui@latest
```

```tsx
import { Button } from "@arctis-sh/ui/button"
```

Point Tailwind to the package so it can generate the utility classes:

```css
@import "tailwindcss";
@source "../node_modules/@arctis-sh/ui/dist";
```

## Typeset

For HTML and Markdown prose, import the package stylesheet:

```css
@import "@arctis-sh/ui/styles/typeset.css";
```

```tsx
<div className="typeset typeset-docs">{html}</div>
```

## Source

- npm: [@arctis-sh/ui](https://www.npmjs.com/package/@arctis-sh/ui)
- GitHub: [arctis-sh/ui](https://github.com/arctis-sh/ui)

## Next

Browse [Components](/docs/components) and [Blocks](/blocks) for demos. See [Theming](/docs/theming) for tokens and dark mode.