01
Accessible by construction
Keyboard navigation, focus management, and ARIA semantics come from Radix UI primitives — the behavioral building blocks under each component. Correct behavior isn't bolted on. It's where you start.
70+ React components built on Radix UI primitives and styled with Tailwind CSS v4. Typed to the prop, themeable in plain CSS, and yours to copy — source and all.
Playground
Every tile is the real component, running in your browser — fire a toast, scrub the chart, drag the carousel, type into the field. No screenshots. No mockups.
70+
components
100%
accessible
0
config files
Library
All 70+ components, each its own subpath export — so your bundle carries only what you use. Browse the full set below.
Why codefast/ui
The unglamorous parts of a component library — accessibility, types, theming, ownership — are the parts you feel every day. So we started there.
01
Keyboard navigation, focus management, and ARIA semantics come from Radix UI primitives — the behavioral building blocks under each component. Correct behavior isn't bolted on. It's where you start.
02
Components ship as source: unstyled markup plus Tailwind utility classes. Copy one into your codebase and shape it to your brand. Nothing is hidden behind a wrapper you can't reach.
03
Every component exports its prop types, so autocomplete, refactors, and composition just work. Mistakes surface in your editor — never at runtime.
04
Palettes of oklch design tokens with a dark variant. Restyle the whole set from one file, and switch light and dark without a line of JavaScript.
Get started
Add the package, import three lines of CSS, and build. Design tokens, dark mode, and accessibility are already wired up — there's nothing to configure.
$pnpm add @codefast/ui