VUI - Beautiful UI Components

A custom component library built on top of Shadcn UI, enhanced with Tailwind CSS and Framer Motion animations that speeds up your shipping process.

Tech Stack

• Next.js 16 - React framework
• React 19 - UI library
• Tailwind CSS 4 - Utility-first CSS
• Shadcn UI - Component foundation
• Framer Motion - Animation library
• TypeScript - Type safety
• Radix UI - Accessible primitives

Getting Started

Installation

1. Clone the repository:

git clone https://github.com/vineet-op/vui.git
cd vui

2. Install dependencies:

bun install

3. Run the development server:

bun dev

4. Open http://localhost:3000 in your browser.

Project Structure

vui/
├── app/                    # Next.js app directory
│   ├── docs/              # Documentation pages
│   └── page.tsx           # Landing page
├── components/
│   ├── ui/                # Shadcn UI components
│   ├── custom/            # Custom components
│   └── landing/           # Landing page components
├── public/                # Static assets
└── content/               # MDX documentation

Available Custom Components (Will add more)

• Keyboard Component
• Text Stagger Animation
• Expandable Cards
• Mask Hover Effect

Usage

Browse the documentation at /docs to see live examples and code snippets for each component. Simply copy the code and paste it into your project.

Scripts

bun dev          # Start development server
bun build        # Build for production
bun start        # Start production server
bun lint         # Run ESLint

Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

License

MIT License - feel free to use this project for personal or commercial purposes.

Links

• GitHub: github.com/vineet-op/vui
• Documentation: Visit /docs for component documentation

---

Built with ❤️ by Vineet using Next.js, Tailwind CSS, Shadcn UI, and Framer Motion