Ready

_Overview

The Phase2_ component library — shadcn/ui components themed with our brand tokens. Copy them into your project, they're yours.

_WhatThisIs

This is a themed component reference built on shadcn/ui + Tailwind CSS. Every component uses Phase2_ colors, typography, and spacing out of the box.

The theme is defined as CSS variables — swap them in and your components are branded. Dark mode included.

Init shadcn in your project

npx shadcn@latest init

Copy the Phase2_ theme

Grab the CSS variables from the Theme page

Add components

npx shadcn@latest add button card input

See the full Installation guide for details.

Primary, secondary, destructive, outline, ghost, and link variants in multiple sizes.

Content containers with headers, footers, and composable layouts.

Input, textarea, select, checkbox, radio, switch, slider, and label components.

Badge, avatar, progress bar, and separator for presenting information.

Alert, dialog, and tooltip for communicating status and actions.

Tabs, accordion, and separator for organizing content.