Pre-order Card

Coming-soon product card with a tone Pre-order pill, notify-count, calendar release date, price, and a tone-filled Reserve button.

Pre-order1,284 notified

Air Max 90 Limited EditionShips May 15

$159

Requires shadcn/ui initialized. Run npx shadcn@latest init if you haven't.

Import & use

import { Commerce27 } from "@/components/beste/piece/commerce27";

<Commerce27
  name="Air Max 90 Limited Edition"
  releaseDate="Ships May 15"
  badge="Pre-order"
  price="$159"
  notified={1284}
  tone="primary"
/>