All components
Available nowReact

Product card

A premium component listing with useful proof, pricing, and a tactile action.

shadcnRegistry install command
npx shadcn add http://localhost:3000/r/menace-product-card.json

Preview

Live component behavior

Interactive
Preview size
desktop
Popular
Application shell

Command workspace

Responsive sidebar, command menu, and twelve polished states.

variants
48
rating
4.9
source
TS
$29

Use it in context.

Copy the component into your project, then adapt the source to the interface around it.

TSXUsage example
import { MenaceProductCard } from "@/components/menace-product-card";

export default function Component() {
  return <MenaceProductCard title="Command workspace" price="$29" />;
}

API and behavior

titleCommand workspace
Primary product or component name.
metricsThree proof points
Typed label and value pairs shown above the price.
previewReadyuncontrolled
Controlled action-completion state.
onActionundefined
Receives the native action-button event.
  • Supports controlled and uncontrolled preview-ready states.
  • Uses semantic article, heading, metric list, and button elements.
  • Spring feedback automatically collapses to instant state changes when reduced motion is requested.