A responsive e-commerce product grid with star ratings, sale/bestseller badges, and per-card add-to-cart buttons for shop and catalog pages.
import Ecommerce1 from "@/components/ui/ecommerce1";
export default function Ecommerce1Demo() {
return (
<Ecommerce1
badge={{ label: "New Arrivals", variant: "outline" }}
heading="Shop our latest collection"
description="Discover our handpicked selection of premium products designed for modern living."
currency="$"
products={[
{
name: "Minimal Desk Lamp",
price: 89,
originalPrice: 129,
image:
"https://cdn.21st.dev/assets/mirror/c0/c0f82fcc37da2a87edfcf3fc5f00faf84f7cd6412f53ab25c8d7446d5fb25838.jpg",
badge: "Sale",
rating: 4.8,
reviewCount: 124,
},
{
name: "Ceramic Vase Set",
price: 65,
image:
"https://cdn.21st.dev/assets/mirror/96/96c38882ead90fc7fa153b9b782b2a7d032d2e3d8f1fc830cba4be00a54bb132.jpg",
rating: 4.9,
reviewCount: 89,
},
{
name: "Wooden Side Table",
price: 199,
image:
"https://cdn.21st.dev/assets/mirror/d0/d0dc062baa213f5a87b3a7a13ea53ec144a4715f1dffa3b3f70be3f6489391fc.jpg",
badge: "Bestseller",
rating: 4.7,
reviewCount: 256,
},
{
name: "Linen Throw Blanket",
price: 79,
originalPrice: 99,
image:
"https://cdn.21st.dev/assets/mirror/43/4383b74c85e76d87a780b07a7cd9be7a8807fcf10aed83ff6411dc69d52d6be2.jpg",
rating: 4.6,
reviewCount: 67,
},
]}
onAddToCart={(product) => console.log("add to cart", product.name)}
/>
);
}