# Introduction

> Motion-rich, niche components for shadcn/ui projects. Accessible, customizable, and open source.

Source: https://www.cult-ui.com/docs

Cult UI is a shadcn/ui registry of animated, niche components: AI prompt inputs, Halo form controls, shader heroes, device mockups, illustrations, and more. Every component is plain React and Tailwind CSS source that you add to your project with the shadcn CLI, then own and edit like the rest of your code.

## How it works

Cult UI is not an npm package. It is a [registry](https://ui.shadcn.com/docs/registry) that the shadcn CLI already knows about under the `@cult-ui` namespace.

When you run `npx shadcn@latest add @cult-ui/halo-button`, the CLI:

1. Copies `halo-button.tsx` into your `components/ui` folder.
2. Installs the npm packages it needs, such as `motion` and `@base-ui/react`.
3. Adds any shadcn/ui components it builds on, such as `button` or `badge`.

There is no Cult UI runtime and nothing to keep in sync. Components use your shadcn theme tokens (`bg-card`, `text-muted-foreground`, `ring-ring`), so they pick up your colors, radius, and dark mode.

## Quick start

In a React project that already uses shadcn/ui:

```bash
npx shadcn@latest add @cult-ui/halo-button
```

```tsx
import { HaloButton } from "@/components/ui/halo-button"

export default function Page() {
  return <HaloButton>Get started</HaloButton>
}
```

New project, or not using shadcn/ui yet? Start with [Installation](/docs/installation).

## Where to go next

<div className="mt-6 grid gap-4 sm:grid-cols-2">
  <LinkedCard href="/docs/installation">
    <p className="font-medium">Installation</p>
    <p className="text-muted-foreground mt-1 text-center text-sm">
      Set up a project and add your first component
    </p>
  </LinkedCard>
  <LinkedCard href="/docs/theming">
    <p className="font-medium">Theming</p>
    <p className="text-muted-foreground mt-1 text-center text-sm">
      Which tokens components read and how to restyle them
    </p>
  </LinkedCard>
  <LinkedCard href="/docs/mcp-server">
    <p className="font-medium">MCP Server</p>
    <p className="text-muted-foreground mt-1 text-center text-sm">
      Let Cursor or Claude Code search and install components
    </p>
  </LinkedCard>
  <LinkedCard href="/docs/llms">
    <p className="font-medium">LLMs & Agents</p>
    <p className="text-muted-foreground mt-1 text-center text-sm">
      llms.txt, markdown docs, and agent rules
    </p>
  </LinkedCard>
</div>

## FAQ

### Do I need shadcn/ui to use Cult UI?

You need the shadcn CLI setup, which is a `components.json` file, a `cn` helper, and shadcn theme tokens in your CSS. Running `npx shadcn@latest init` creates all three. You do not need to use any other shadcn/ui components, although some Cult UI components build on them and the CLI adds those for you.

### Which frameworks are supported?

Any React framework that shadcn/ui supports, including Next.js, Vite, React Router, Astro, and TanStack Start. A few components import `next/image` or `next/link`. They work best in Next.js and need a small swap elsewhere, which the [Vite guide](/docs/installation/vite) lists.

### Which versions of React and Tailwind CSS do the components target?

React 19 and Tailwind CSS v4, matching a fresh `shadcn init`. Most components also run on React 18. Animated components use [Motion](https://motion.dev) and respect `prefers-reduced-motion`.

### Why copy source instead of installing a package?

Owning the source lets you change anything, from markup to animation timing, without fighting a package API or waiting for a release. The tradeoff is that updates are manual. Re-run `shadcn add` with `--overwrite` to pull the latest version of a component, then review the diff.

### Can I use Cult UI in commercial projects?

Yes. Cult UI is [MIT licensed](https://github.com/nolly-studio/cult-ui/blob/main/LICENSE.md) and free for personal and commercial use, with no attribution required.