Status

A pulsing dot with a label to show system status. Four states included: online (green), offline (red), maintenance (blue), degraded (amber). The colors are clear enough that users immediately understand what's happening. Use for status pages, dashboards, user presence, or anywhere you need to show "is this working?" at a glance. Show just the dot, just the label, or both.

Status preview

Installation

npx shadcn@latest add https://www.shadcn.io/r/status.json

npx shadcn@latest add https://www.shadcn.io/r/status.json

pnpm dlx shadcn@latest add https://www.shadcn.io/r/status.json

bunx shadcn@latest add https://www.shadcn.io/r/status.json

Related Components

FAQ