Menu

Get Started

Components

Blocks

Introduction

A quick introduction to arctis/ui and how to get started.

arctis/ui is a set of open-source React components you can use as the foundation for your own design system.

Add the pieces you need, then make them yours with your own tokens.

npx @arctis-sh/@arctis-sh/ui@latest add button
import { Button } from "@/components/ui/button"

Principles

  • Open code — the source lives on GitHub and the package is published as @arctis-sh/ui.
  • Composition — components share familiar patterns, so they work predictably together.
  • Theme tokens — colors and radii come from your CSS variables.
  • Solid defaults — a clean starting point that is easy to adapt to your brand.
  • Readable by design — the docs and source are clear for both people and tools.

How it works

  1. Run npx @arctis-sh/ui@latest add … in a React + Tailwind v4 app.
  2. Define theme tokens in your global CSS.
  3. Import from @/components/ui/… or @/components/blocks/….
  4. If you prefer npm imports, install the full package instead.

See Installation for the full setup.

Own the look

There is no fixed theme. Change the tokens, override classes, or fork the source when you need more control. The package is the standard way to use arctis/ui; the GitHub repository remains the source of truth.

Next