Style Guide
← Back to Debug ToolsLive app styles
Typography Hierarchy
Reference the existing app hierarchy before introducing a new text treatment.
32pxPage TitlePrimary page heading
20pxSection TitleCard / section heading
18pxPrimary ContentItem and check titles
14pxBody / ControlsInputs, buttons, messages
12pxCompact UIFlags, results, footer
10pxMicro LabelBadges / dense metadata
8px–40px Type Reference
Core Colors
Background
--bg
--bg
Card
--card
--card
Accent
--accent
--accent
Text
--text
--text
Muted
--muted
--muted
Border
--border
--border
Success
--success
--success
Danger
--danger
--danger
Controls & Status
Primary
Secondary
Input
StatusComplete Pending
Spacing & Shape
Card radius18px--radius
Control radius12px--small-radius
Card shadow0 6px 24px--shadow