Card — Commerce

Kartu produk, harga, pesanan, dan ulasan untuk e-commerce.

Kartu commerce untuk storefront dan alur checkout. Warna brand dipetakan ke --primary, sehingga CTA, badge, dan border harga unggulan mengikuti tema yang aktif.

Preview

−20%

Ceramics

Stoneware Mug

$28 $35 4.9

Studio Popular

$24 / month

Billed annually · per seat

Unlimited cards

All 18 themes

Figma + code export

Priority support

#CS-2041 On the way

Arrives today

Estimated 4:30 – 5:00 PM

Ordered

Shipped

Out

Delivered

Sam Okafor

Verified purchase · 3 days ago

5.0

Swapped our whole admin to the Carbon theme in a day. The cards just snapped into the new look — zero rework.

Helpful (42) Reply

Install

Setiap kartu diinstal sendiri-sendiri:

bun x bosia@latest add block cards/product
bun x bosia@latest add block cards/pricing
bun x bosia@latest add block cards/order
bun x bosia@latest add block cards/review

Masing-masing menarik paket npm @lucide/svelte untuk ikon.

Usage

<script lang="ts">
	import Pricing from "$lib/blocks/cards/pricing/block.svelte";
</script>

<Pricing featured />

Kartu harga menerima prop featured (default true) yang mengalihkan border tersorot dan CTA primary. Toggle suka dan tambah-ke-tas pada kartu produk hanyalah $state lokal kosmetik.