Introduction
A component library built on shadcn/ui, Base UI, and Tailwind CSS v4.
Faber UI is a component library built on shadcn/ui, Base UI, and Tailwind CSS v4. It is copy-paste friendly, RTL-ready, and designed to be instantly familiar to anyone who has used shadcn before.
Features
shadcn-compatible API
Variants, sizes, and render-prop composition that match the conventions you already know.
Base UI primitives
Accessible, unstyled components from @base-ui/react power every interaction.
Tailwind CSS v4
Zero-runtime styling with CSS variables and oklch color tokens.
RTL ready
Right-to-left layouts work out of the box across the entire kit.
Remixicon
A consistent icon set wired into every component that needs one.
60 components
From buttons and dialogs to charts and carousels, all vendored and editable.
How it works
Components are copied into your project by the shadcn CLI, so you own the
source and can edit any of them. The first component you add also copies the
theme, the tokens and motion utilities every component uses, into
styles/faber/. Getting Started walks through both.
pnpm dlx shadcn@latest add https://faber-ui.vercel.app/r/dialog.jsonimport { Button } from "@/components/ui/button";
export default function Example() {
return <Button>Click me</Button>;
}Head to the Components section to explore each component, its variants, and its API.
Last updated on