Prometheus Design System

Card Title without Icon

Plain-text card heading used on /tsdb-status — 'TSDB Head Status', 'Top 10 label names…'. Non-canonical; should migrate to Card Title with Icon.

DO

Migrate each instance to Card Title with Icon and pick a tabler glyph that reflects the content.

DON'T

Use new. Four stacked plain-text cards blur together — add an icon per card.

Design

default

TSDB Head Status

heading/card-title text, no icon.

Component reference (screenshots)
/tsdb-status
/tsdb-status light

Placeholder screenshots — the audited app is live at prometheus-e83j.onrender.com.

Implementation

<CardTitle>TSDB Head Status</CardTitle>  // deprecated — use CardTitle with icon

Layout

PropertyValue
font-size18px heading/card-title

Accessibility

Related inconsistencies