Installation
Getting started with Lumex UI
1. Install utilities
All components use Tailwind CSS v4, so make sure it's set up in your project.
Many components also use the cn utility — install it with:
bunx --bun shadcn@latest add https://lumexui.vercel.app/r/utils.jsonnpx shadcn@latest add https://lumexui.vercel.app/r/utils.jsonpnpm dlx shadcn@latest add https://lumexui.vercel.app/r/utils.json2. Add a component
We use Lucide for icons and some shadcn/ui primitives — these are automatically installed by the CLI when needed.
For example, to add card-05:
bunx --bun shadcn@latest add https://lumexui.vercel.app/r/card-05.jsonnpx shadcn@latest add https://lumexui.vercel.app/r/card-05.jsonpnpm dlx shadcn@latest add https://lumexui.vercel.app/r/card-05.jsonThen use it in your page:
import Card05 from "@/components/lumexui/card-05";
export default function Page() {
return <Card05 />;
}We recommend using the CLI over copy-pasting — it ensures all required files and dependencies are included.
3. Blocks
Blocks are multi-file compositions that form complete UI sections. The CLI is required to install them correctly.
For example, to install the ai-card-generation block:
bunx --bun shadcn@latest add https://lumexui.vercel.app/r/ai-card-generation.jsonnpx shadcn@latest add https://lumexui.vercel.app/r/ai-card-generation.jsonpnpm dlx shadcn@latest add https://lumexui.vercel.app/r/ai-card-generation.jsonThen use it in your page:
/**
* All sub-components are automatically installed by the CLI.
*/
import AICardGeneration from "@/components/lumexui/AICardGeneration";
export default function Page() {
return <AICardGeneration />;
}4. Optional dependencies
Some components require additional libraries (e.g. framer-motion, recharts). These are listed at the bottom of each component's page — install them if the component requires it.
5. Monorepo
Use the -c flag to point the CLI at your workspace app:
bunx --bun shadcn@latest add https://lumexui.vercel.app/r/card-05.json -c ./apps/wwwnpx shadcn@latest add https://lumexui.vercel.app/r/card-05.json -c ./apps/wwwpnpm dlx shadcn@latest add https://lumexui.vercel.app/r/card-05.json -c ./apps/www