Available on npm · MIT license

Build products faster with Cassa UI

A production-ready React design system. Tokens, components, forms, auth, and data visualization — all independently versioned in one monorepo.

npx create-cassa-ui@latest my-app

Get started →Live Demo →

Built withReact 19TypeScriptNext.jsTailwind CSSTurborepoTanStack QueryZod

Designed for product teams

Four principles behind every design decision.

Token-driven

Every color, spacing, and radius comes from @cassa/tokens. Change a token and it propagates to every component, light mode, and dark mode instantly.

Type-safe by default

Column keys check against your data shape. Form names check against your Zod schema. TypeScript catches mismatches before they reach users.

No lock-in

Auth components accept any onSubmit handler. Wire them to next-auth, Clerk, a custom JWT, or your own backend — the UI stays yours.

Monorepo-ready

Each package is independently versioned. Consume only what you need — feature teams pick components like npm packages from a private registry.

Five-layer architecture

Imports flow down. Packages never import from apps. Teams stay independent.

Foundation

@cassa/tokens@cassa/typescript-config@cassa/eslint-config

Core

@cassa/utils@cassa/hooks@cassa/types@cassa/api-client

@cassa/ui@cassa/ui-forms@cassa/ui-layout@cassa/ui-data

Feature

@cassa/auth-ui@cassa/notifications

Apps

apps/webapps/docs

10 packages, one monorepo

Each package is independent, typed, and directly importable.

@cassa/tokensFoundation

CSS variables, JS exports, and a Tailwind preset compiled from a single source of truth.

@cassa/uiUI

Button, Badge, Card, Heading, Text, Separator — token-driven primitives.

@cassa/ui-formsUI

Input, Textarea, Select, Checkbox, Switch, FormField — React Hook Form + Zod.

@cassa/ui-layoutUI

Stack, Grid, Container, Sidebar — structural layout primitives.

@cassa/ui-dataUI

Sortable Table with search and pagination. LineChart and BarChart with token colors.

@cassa/auth-uiFeature

LoginForm, SignupForm, ForgotPasswordForm, AuthGuard — bring your own auth logic.

@cassa/notificationsFeature

Toast system — 4 variants, auto-dismiss, persistent mode, queue management.

@cassa/api-clientCore

Typed fetch wrapper with TanStack Query, token injection, and structured error handling.

@cassa/hooksCore

useDebounce, useLocalStorage, useMediaQuery, useClickOutside, usePrevious.

@cassa/utilsCore

cn(), formatCurrency(), formatDate(), truncate(), slugify() and other helpers.

Ready to start building?

Scaffold a new project in seconds. Everything configured and ready to go.

npx create-cassa-ui@latest my-app

Read the docs Browse components