Search

Search components and blocks

Sign in

Card Blocks

Pricing, profile, and product cards — self-contained surfaces built on shadcn primitives, ready to drop into a page.

Agent Score Card

Pro

An always-dark hero stat card framed with a double border — a faint outer ring, a gap, then the real edge — instead of a drop shadow, with a soft violet glow tucked in the corner for depth. The run-activity grid renders four real intensity levels in the card's own violet accent, its bottom-left cluster breathing gently as the agent's current streak of successful runs, while the count-up score and tasks/tokens/tool calls/uptime rows file in staggered on the right, each behind its own colored icon chip and highlighting on hover.

pnpm dlx shadcn@latest add @ditherui/agent-score-card

AGENT SCORE

0

Tasks completed0
Tokens used0.0K
Tool calls0
Uptime0.0%

Props

className / ...div propsReact.ComponentProps<"div">—

Suggested components