Installation

Install shoppablecn components into your shadcn/ui project using the shadcn CLI. Component source copies directly into your project — no npm package, no runtime dependency.

Prerequisites

• shadcn/ui initialized in your project
• Next.js 15+ (or any React project compatible with shadcn)
• TypeScript

Install components

npx shadcn@latest add https://shoppablecn.dev/r/product-card.json

npx shadcn@latest add https://shoppablecn.dev/r/quick-options.json

npx shadcn@latest add https://shoppablecn.dev/r/hotspot-image.json

The CLI downloads the component source into your project and installs any shadcn primitives it depends on (Button, Card, Badge, etc.).

Next steps

• Introduction — overview of the library
• ProductCard, QuickOptions, HotspotImage — component documentation