shoppablecn
v1.0

Shoppable UI components for shadcn

Ship interactive product cards, quick-buy overlays, and shoppable scenes.

Browse ComponentsView on GitHub

Everything you need to ship

Your shadcn commerce UI toolkit

Copy & Paste
No npm install required. Install via shadcn CLI.
npx shadcn@latest add https://shoppablecn.dev/r/product-card.json
AI Ready
llms.txt and full-source references help AI tools install and use the components.
Accessibility Ready
WAI-ARIA compliant. Full keyboard navigation. Screen reader tested.

Three components, infinite scenes

Mix, match, and extend the three primitives that power the library.

Product Card
Flexible product cards with three layouts and overlay variant mode.
Learn more
Quick Options
Slide-up overlay for variant selection. Swatches, pills, sliders, dropdowns, and more.
Learn more
Hotspot Image
Shoppable scenes with pin-based product cards, tooltips, or any custom content.
Learn more

Ready to build shoppable interfaces?

Ship your next ecommerce project today.

Get Started

© 2026 shoppablecn - Ecommerce UI Components - View project on GitHub