---
name: "@commercn"
slug: "commercn"
description: "A focused set of shadcn/ui blocks specifically for e-commerce UIs. Current catalog includes cart-item variants (cart-item-01, cart-item-02) with further blocks in progress. Built with Next.js 16, React 19, TypeScript, Tailwind CSS v4, Motion animations, and Fumadocs for docs. Free and MIT-licensed. Use for: adding styled shopping-cart and checkout UI blocks to a Next.js e-commerce storefront without building cart components from scratch."
category: "E-commerce/payments"
tags: ["accessibility", "aesthetic", "animation", "blocks", "cards", "e-commerce", "loaders"]
framework: "react"
license: null
author: "Logging-Studio"
website: "https://commercn.com"
github: "https://github.com/Logging-Studio/Commercn"
registry: "https://commercn.com/r/registry.json"
pro: false
pro_url: null
github_stars: 72
component_count: 17
generated_at: "2026-09-21T01:50:16.753Z"
---

# @commercn

A focused set of shadcn/ui blocks specifically for e-commerce UIs. Current catalog includes cart-item variants (cart-item-01, cart-item-02) with further blocks in progress. Built with Next.js 16, React 19, TypeScript, Tailwind CSS v4, Motion animations, and Fumadocs for docs. Free and MIT-licensed. Use for: adding styled shopping-cart and checkout UI blocks to a Next.js e-commerce storefront without building cart components from scratch.

## Links

- Website: https://commercn.com
- GitHub: https://github.com/Logging-Studio/Commercn
- Registry JSON: https://commercn.com/r/registry.json
- Directory page: https://sh4dcn.vercel.app/registry/commercn
- This file: https://sh4dcn.vercel.app/md/commercn.md

## Install

```sh
# add the whole registry (shadcn CLI)
npx shadcn@latest add https://commercn.com/r/registry.json
pnpm dlx shadcn@latest add https://commercn.com/r/registry.json
bunx shadcn@latest add https://commercn.com/r/registry.json
# clone the source repo
git clone https://github.com/Logging-Studio/Commercn.git
# fetch the raw registry index
curl -s https://commercn.com/r/registry.json
```

## Components (17)

| name | type | description | install |
| --- | --- | --- | --- |
| cart-01 | registry:block | Cart 01 | `npx shadcn@latest add https://commercn.com/r/cart-01.json` |
| checkout-01 | registry:block | Checkout 01 | `npx shadcn@latest add https://commercn.com/r/checkout-01.json` |
| checkout-02 | registry:block | Checkout 02 | `npx shadcn@latest add https://commercn.com/r/checkout-02.json` |
| checkout-03 | registry:block | Checkout 03 | `npx shadcn@latest add https://commercn.com/r/checkout-03.json` |
| cart-02 | registry:block | Cart 02 | `npx shadcn@latest add https://commercn.com/r/cart-02.json` |
| category-01 | registry:block | Category 01 | `npx shadcn@latest add https://commercn.com/r/category-01.json` |
| category-02 | registry:block | Category 02 | `npx shadcn@latest add https://commercn.com/r/category-02.json` |
| category-03 | registry:block | Category 03 | `npx shadcn@latest add https://commercn.com/r/category-03.json` |
| category-04 | registry:block | Category 04 | `npx shadcn@latest add https://commercn.com/r/category-04.json` |
| order-01 | registry:block | Order 01 | `npx shadcn@latest add https://commercn.com/r/order-01.json` |
| product-card-01 | registry:block | Product Card 01 | `npx shadcn@latest add https://commercn.com/r/product-card-01.json` |
| product-card-02 | registry:block | Product Card 02 | `npx shadcn@latest add https://commercn.com/r/product-card-02.json` |
| product-card-03 | registry:block | Product Card 03 | `npx shadcn@latest add https://commercn.com/r/product-card-03.json` |
| product-detail-01 | registry:block | Product Detail 01 | `npx shadcn@latest add https://commercn.com/r/product-detail-01.json` |
| review-01 | registry:block | Review 01 | `npx shadcn@latest add https://commercn.com/r/review-01.json` |
| review-02 | registry:block | Review 02 | `npx shadcn@latest add https://commercn.com/r/review-02.json` |
| review-03 | registry:block | Review 03 | `npx shadcn@latest add https://commercn.com/r/review-03.json` |

## For AI agents

```text
You are adding components from @commercn to a shadcn-compatible project.
1. Read this file (https://sh4dcn.vercel.app/md/commercn.md) for the component list.
2. Fetch the machine-readable index: https://commercn.com/r/registry.json
3. Install a single component with its install command from the table above.
4. Full structured record: https://sh4dcn.vercel.app/json (library slug: commercn).
```