Uptime Grid
30-day per-service reliability grid with each cell shaded by status using foreground opacity tokens and a per-row uptime figure.
30-day per-service reliability grid with each cell shaded by status using foreground opacity tokens and a per-row uptime figure.
Search blocks by description or jump to a page.
The source for every Application block is included with Basic and Pro. Pick a plan to copy the code.
Already purchased? Log in
Uptime Grid is the 30-day historical reliability view: seven services (API, Dashboard, Webhooks, CDN, Auth, Storage, Search) run down the left, calendar days May 14 through Jun 13 run across, and each cell is a div tick shaded by status using foreground opacity tokens: bg-foreground/15 for Operational, bg-foreground/50 for Degraded, bg-foreground/80 for Outage. A per-row uptime figure (99.74% to 100.00%) closes each row at the right. A three-chip legend anchors the header.
Status is a DayStatus union so every cell is typed. The day labels are generated from a Date loop so they never drift out of sync.
Reach for this block below the service rows on a status page or inside a reliability report, wired to your synthetic monitor history endpoint. The day count and date start are data, swap them for your retention window.
A natural flow around it on an Application Pro page:
Before
After
One strong use is the public platform reliability grid. Other grid shapes:
Tip: include the footnote about polling cadence, the number means nothing without the measurement method.