Trend Delta Badge

A metric delta badge with trend arrows for dashboards, stat rows, and pricing tables.

+12.4%vs last month

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

Import & use

import { Badge9 } from "@/components/beste/component/badge9";

<Badge9 value="+12.4%" label="vs last month" />

<Badge9
  value="-3.2%"
  tone="down"   // "up" (default) | "down" | "flat"
/>