Elixir UIElixir UI Documentation
Welcome to the comprehensive documentation for Elixir UI - a modern, fast, and lightweight component library for React applications. Get started quickly with beautiful, accessible components.
Quick Start
Get up and running in minutes with these simple steps:
Install
Initialize Elixir UI in your project
npx @elixir-labs/ui initAdd Components
Add the components you need
npx @elixir-labs/ui add buttonUse & Customize
Import and use in your components
import { Button } from "@/components/ui/button";
<Button>Click me</Button>Explore the Documentation
Getting Started
→Learn about Elixir UI's philosophy, features, and how to get started with your first component.
Components
→Explore our collection of beautiful, accessible components with live examples and source code.
Framework Guides
→Step-by-step installation guides for popular React frameworks and build tools.
Templates
→Pre-built page templates and component combinations to accelerate your development.
Available Components
All components are designed with accessibility, performance, and customization in mind:
Why Elixir UI?
Copy & Paste
No heavy npm packages. Get the source code directly in your project for full control.
Fully Customizable
Modify styles, behavior, and structure to match your exact requirements.
TypeScript Ready
Built with TypeScript for excellent developer experience and type safety.
Accessible by Default
All components follow WAI-ARIA guidelines and accessibility best practices.
Modern Styling
Built with Tailwind CSS for consistent, maintainable, and responsive designs.
Framework Agnostic
Works with Next.js, Vite, Create React App, and any React setup.
🚀 Ready to get started?
Jump into our introduction guide to learn more about Elixir UI, or go straight to the installation guide to set up your first project.