Theme verification

Toggle confirms dark mode tokens are wired correctly.

Semantic color tokens

background
card
muted
primary
secondary
accent
destructive
sidebar

Type scale

Display — 36–48 px fluid

Heading 1 — 30–36 px fluid

Heading 2 — 24–30 px fluid

Heading 3 — 20 px

Body — 16 px default copy

Body-sm — 14 px dense copy

Label — 14 px medium weight

Caption — 12 px muted

Input tokens

Component Sandbox

Phase 0 primitives — dev only, never ships to production

Text

Variants

Body — The quick brown fox jumps over the lazy dog

Body SM — The quick brown fox jumps over the lazy dog

Label — The quick brown fox jumps over the lazy dog

Caption — The quick brown fox jumps over the lazy dog

Colors

Default color

Muted color

Polymorphic as

as span
  • as li

  • Heading

    Heading Level 1 — fluid clamp(30px → 36px)

    Heading Level 2 — fluid clamp(24px → 30px)

    Heading Level 3 — fixed 20px


    Spinner

    Sizes


    Button

    Variants

    Sizes

    States


    Input

    States


    Card

    Repository scan
    Last scanned 2 hours ago

    3 critical, 7 high-severity findings detected across 42 files.


    Badge

    Standard variants

    Default
    Secondary
    Destructive
    Outline

    Severity variants

    Critical
    High
    Clean
    No scan

    Avatar

    With image src (falls back in dev)

    SC

    Fallback initials

    JDABMK

    Skeleton

    Lines

    Shapes


    Dropdown

    Working example


    EmptyState

    No repositories

    Connect a repository to start scanning for vulnerabilities.

    No findings

    This repository is clean — no issues detected.