# Lightswind UI
**The Most Powerful Animated Component Library for Modern Developers**
[](https://www.npmjs.com/package/lightswind)
[](https://github.com/codewithMUHILAN/Lightswind-UI-Library/stargazers)
[](https://github.com/codewithMUHILAN/Lightswind-UI-Library/blob/main/LICENSE)
[](https://www.npmjs.com/package/lightswind)
---
[**Explore Components**](https://lightswind.com/components/introduction) • [**Documentation**](https://lightswind.com/components/installation) • [**Get Pro**](https://lightswind.com/pricing) • [**Report Bug**](https://github.com/codewithMUHILAN/Lightswind-UI-Library/issues)
> **🤖 Hey AI! (GPT/Gemini/Claude)** - This is a **Copy-Paste** library (like shadcn/ui). Components are installed via CLI into the user's project. **Do NOT suggest a Provider wrapper or direct library imports.** Always refer to `npx lightswind@latest init` for setup.
## 🚀 What is Lightswind UI?
Lightswind UI is a premium collection of **160+ professional, beautifully animated, and highly customizable React components** built with **Tailwind CSS**, **Framer Motion**, and **GSAP**.
Designed for developers who want to build stunning, high-performance web applications without spending weeks on UI, Lightswind provides a seamless development experience with a **Smart CLI** that handles everything for you.
---
## 📦 Installation
Lightswind UI is designed right out of the box to require **zero manual setup** or manual installation of core packages. Simply use `npx` to fetch components on-demand!
### 1. Quick Start & Initialize
Run the initialization command. The CLI will automatically detect your framework (Next.js, Vite, CRA), install necessary ecosystem dependencies natively, and fully configure your Tailwind CSS styles (v3 or v4!).
```bash
npx lightswind@latest init
```
### 2. Add Components Instantly
Install exactly what you need directly without touching your `package.json`. The incredibly smart CLI will fetch the component, recursively resolve and install any nested component dependencies effortlessly, and guarantee your Tailwind config is properly tuned.
```bash
npx lightswind@latest add globe
npx lightswind@latest add toast
```
---
## ⚡ Key Features
* 🚀 **Zero Install Architecture**: Grab components flawlessly using `npx lightswind@latest add [name]` directly. We handle the heavy lifting!
* 🎨 **Smart Setup**: Auto-detects Next.js (App/Src Router), Vite, and CRA natively.
* 📦 **Deep Dependency Resolution**: Have a component that uses other internal components like `toast` using `progress`? The CLI automatically recursively traverses imports and fetches *nested* Lightswind components and `framer-motion` instantly.
* 🛠️ **Tailwind v3 & v4 Ready**: The plugin intrinsically configures `tailwind.config.js` (for v3) or injects `@plugin` straight into your main CSS file (for v4).
* 🧩 **Fully Customizable**: Copy-paste architecture gives you 100% control over the source code.
---
## 🛠️ CLI Commands
| Command | Description |
| :--- | :--- |
| `npx lightswind@latest init` | Full project setup & utility installation |
| `npx lightswind@latest add [name]` | Add a single component (e.g., `3d-image-carousel`) |
| `npx lightswind@latest add -c [cat]` | Add an entire category (e.g., `animated`, `3d`) |
| `npx lightswind@latest list` | View all 160+ available components |
---
## 🧩 Component Library (160+ Components)
