Introduction
What LibyUI is, why it was built, and how to install and use it in your project.
Introduction
LibyUI is a modern, accessible, and beautifully designed React component library built with TypeScript and Tailwind CSS. Components are crafted to help you build stunning web applications with confidence — without sacrificing accessibility or developer experience.
Why LibyUI?
Quick Start
Install LibyUI using your preferred package manager
Import the component you need into your file
Use it — props, variants, and sizes are fully typed
Installation
npm install libyui
# or
yarn add libyui
# or
pnpm add libyui
Basic Usage
import { Button } from "@/components/ui/button";
import { Card, CardHeader, CardTitle, CardContent } from "@/components/ui/card";
export default function App() {
return (
<Card>
<CardHeader>
<CardTitle>Hello, LibyUI</CardTitle>
</CardHeader>
<CardContent>
<Button variant="default" size="lg">
Get Started
</Button>
</CardContent>
</Card>
);
}
What's inside?
Components
Primitives and composite components — the core building blocks of every UI.
Blocks
Pre-built layout sections you can copy, paste, and customize instantly.
Modules
Higher-level feature modules like data tables and form systems.
Patterns
Proven design and composition patterns for common UI challenges.
Recipes
Step-by-step recipes for building real-world features with LibyUI.
Tooling
CLI, TypeScript config, linting, and the developer toolchain.
Was this introduction helpful? Let us know — your feedback shapes the docs.
How is this guide?
Last updated on 2/26/2026