lightswind
Advanced tools
A collection of beautifully crafted React Components, Blocks & Templates for Modern Developers. Create stunning web applications effortlessly by using our 160+ professional and animated react components.
The Most Powerful Animated Component Library for Modern Developers
🤖 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 initfor setup.
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.
Add Lightswind to your project dependencies.
npm install lightswind@latest
Run the initialization command. The CLI will automatically detect your framework (Next.js, Vite, or CRA) and setup your directories and Tailwind configuration.
npx lightswind@latest init
Install exactly what you need. The CLI will manage dependencies automatically.
npx lightswind@latest add globe
tailwind.config.js or your main CSS file for the latest Tailwind versions.| Command | Description |
|---|---|
init | Full project setup & utility installation |
add [name] | Add a single component (e.g., 3d-image-carousel) |
add -c [cat] | Add an entire category (e.g., animated, 3d) |
list | View all 160+ available components |
Zero configuration needed! The CLI automatically adapts to:
npx create-next-app@latest my-app --typescript --tailwind --eslint
cd my-app
npx lightswind@latest init
After running init, your project will look like this:
src/ (or root)
├── components/
│ └── lightswind/ <-- Components added via CLI
│ ├── button.tsx
│ └── globe.tsx
├── lib/
│ └── utils.ts <-- Shared utility functions
├── hooks/
│ └── use-mount.ts <-- Shared animation hooks
└── lightswind.css <-- Custom variable injections
Lightswind UI is built using CSS variables, allowing you to change your entire app's look in one place.
:root {
--primarylw: #173eff; /* Main Brand Color */
--primarylw-2: #3758f9; /* Secondary/Hover Color */
--darklw: #11131B; /* Dark Theme Base */
--background: 0 0% 100%;
--foreground: 0 0% 0%;
--radius: 0.5rem;
}
.dark {
--background: 0 0% 0%;
--foreground: 0 0% 100%;
}
Licensed under the MIT License.
Designed and built with ❤️ by Code with Muhilan
FAQs
A collection of beautifully crafted React Components, Blocks & Templates for Modern Developers. Create stunning web applications effortlessly by using our 160+ professional and animated react components.
We found that lightswind demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Research
/Security News
Malicious packages published to npm, PyPI, Go Modules, crates.io, and Packagist impersonate developer tooling to fetch staged malware, steal credentials and wallets, and enable remote access.
Security News
Microsoft has released an open source toolkit for enforcing runtime security policies on AI agents as adoption accelerates faster than governance controls.
Security News
Multiple high-impact npm maintainers confirm they have been targeted in the same social engineering campaign that compromised Axios.