Getting Started
Templates
Components
Install Ruixen UI Pro components in 2 steps.
Ruixen UI Pro requires a membership. Get lifetime access to all 30+ premium components.
Make sure you have shadcn/ui initialized in your project. If not, run:
Get your CLI token from Account Settings, then add to your components.json:
{
"registries": {
"@ruixenui-pro": "https://pro.ruixen.com/api/r/{name}.json?token=YOUR_CLI_TOKEN"
}
}Replace YOUR_CLI_TOKEN with your actual token (starts with ruixen_cli_).
That's it. The component is now in components/ruixen-pro/hero-bars.tsx.
Auto-installs shadcn/ui dependencies — If a Ruixen Pro component needs shadcn/ui components (like accordion or tooltip), they're automatically installed for you.
Full components.json with Ruixen Pro registry:
{
"$schema": "https://ui.shadcn.com/schema.json",
"style": "new-york",
"rsc": true,
"tsx": true,
"tailwind": {
"config": "tailwind.config.ts",
"css": "app/globals.css",
"baseColor": "neutral",
"cssVariables": true
},
"aliases": {
"components": "@/components",
| Component | Install |
|---|---|
| Hero Bars | npx shadcn@latest add @ruixenui-pro/hero-bars |
| FAQ Section | npx shadcn@latest add @ruixenui-pro/faq-section |
| Bottom Menu | npx shadcn@latest add @ruixenui-pro/bottom-menu |
| Apple Mega Nav | npx shadcn@latest add @ruixenui-pro/apple-mega-nav |
| Bloom Text | npx shadcn@latest add @ruixenui-pro/bloom-text |
ruixen_cli_)Save your token - you won't see it again. If lost, generate a new one.
npx shadcn@latest init first if you don't have components.json@ prefix: "@ruixenui-pro" (not "ruixenui-pro")"config": ""ruixen_cli_Check spelling - use lowercase with hyphens: hero-bars, faq-section, bottom-menu