openstatus logoPricingDashboard

Component Registry

Install beautiful, accessible React components for status pages. Pre-built, customizable components compatible with shadcn/ui.

Build your status page in minutes, not hours. The openstatus registry provides production-ready React components specifically designed for status pages. Built on top of shadcn/ui, these components are accessible, customizable, and battle-tested in production.

What is the Registry?

The openstatus registry is a collection of shadcn/ui-compatible, pre-built components for common status page patterns. Instead of building status indicators, event timelines, and monitoring displays from scratch, install and customize these components directly into your project.

All components are:

  • Accessible - Built with ARIA patterns and keyboard navigation
  • Customizable - Fully themeable with Tailwind CSS
  • Type-safe - Written in TypeScript with complete type definitions
  • Production-ready - Battle-tested in production at openstatus

Example

Hover over the example below to see which component is being used.

System Status
Current status of all services and infrastructure
API
99.8%
45 days ago
today
Website
99.9%
45 days ago
today
Database
100%
45 days ago
today

Recent Events

Feb 15, 2026
in 3 days
Scheduled Database Maintenance
APIDatabase
Scheduled Database Maintenance · February 15 at 2:43 PM - 4:43 PM (for 2 hours)
We will be performing routine database maintenance to improve performance and apply security updates. Expect brief periods of increased latency during this window.
Feb 7, 2026
5 days ago
API Response Time Degradation
APIDatabase
Resolved · February 7 at 5:43 PM (in 3 hours)
Response times have returned to normal. This incident has been resolved.
Monitoring · February 7 at 4:43 PM (1 hour earlier)
Database queries have been optimized. Monitoring performance improvements.
Identified · February 7 at 3:43 PM (1 hour earlier)
We have identified a database query optimization issue causing the slowdown.
Investigating · February 7 at 2:43 PM (1 hour earlier)
We are investigating elevated response times on our API endpoints.

We are working on aligning component Props with @openstatus/sdk-node return values, enabling you to use our SDK to build your own custom status page.

View the GitHub source code for examples and usage patterns.

Installation

Install any component with a single shadcn CLI command:

npx shadcn@latest add https://openstatus.dev/r/status-complete

Or install the registry first:

pnpm dlx shadcn@latest registry add @openstatus

And install the component via:

pnpm dlx shadcn@latest add @openstatus/status-complete

Available Components

Components are organized by functionality:

  • Collections: status-complete, status-essentials - Full status page bundles
  • Building Blocks: status-banner, status-bar, status-feed, status-events, status-component, status-icon, status-layout, status-timestamp - Individual components

Explore the full registry at openstatus.dev/r/registry.json


Want to customize your theme?

Go to Themes Explorer

Learn More

Support

If you encounter issues, have questions, or want to share feedback: