ecomcn

Overview

ecomcn is an open-source shadcn/ui registry of e-commerce blocks: the buy boxes, faceted filters, cart sheets and order summaries that stores otherwise rebuild from scratch. It ships 30 blocks under the MIT license, installed the same way as any shadcn component, with source owned by the project.

The catalog is organized by five stages of the purchase funnel rather than by component type. The site includes a running demo store where shipped blocks are wired together, with keyboard-reachable quick-add and a working promo code field.

Features

• Discover: Announcement bar, editorial hero, category rail, collection grid and a lookbook strip with product hotspots.
• Browse: Product card with compare-at pricing and color swatches, product grid with skeletons and density switch, filter panel, filter sheet, sort toolbar, load more and empty results.
• Product page: Product gallery, buy box, variant swatches, quick view, details accordion, size guide dialog, review summary and related products.
• Cart and checkout: Cart sheet, cart line item, order summary, checkout stepper, delivery options, address form and payment selector.
• Post-purchase: Order confirmation and order tracking blocks.
• URL-driven state: Filters and sorting are designed to live in the URL.
• Theme: An editorial theme item ships with the registry.

Tech stack

• React, Tailwind CSS, shadcn/ui
• Motion, lucide-react

Registry

Install via the shadcn CLI registry:

npx shadcn@latest add @ecomcn/component-name