CLI Installation (Recommended)
The easiest way to get started is by using the Shadcn CLI to install components directly into your project. This handles dependencies, copies the component files, and updates your imports automatically.
1. Initialize
Run the init command to set up your project and create a components.json file.
npx shadcn@latest init2. Configure Namespace (Optional)
Add the GretTech registry namespace to your components.json file to easily install components.
{
"registries": {
"@grettech": "https://www.grettech.com/api/registry/{name}"
}
}3. Add components
You can now start adding components to your project. Use the add command with the specific component registry URL or namespace.
npx shadcn@latest add @grettech/hero-sectionAlternatively, you can install directly via URL:
npx shadcn@latest add https://www.grettech.com/api/registry/hero-sectionManual Installation
If you prefer not to use the CLI, you can manually copy and paste the components into your project.
1. Copy the code
Navigate to the component you want, switch to the "Code" tab, and copy the source code.
2. Create a file
Create a new file in your project (e.g., components/ui/hero-section.tsx) and paste the code.
3. Install dependencies
Check if the component relies on any external packages (like Radix UI primitives, motion, etc.) and install them as specified in the component's installation tab.
npm install @radix-ui/react-slot motionReady to explore?
Browse our comprehensive collection of beautifully crafted, accessible and customizable components.
Browse Components