Governance · Generated from the registry + this app’s own source
Audit
Every token, class and icon in the registry, reconciled against real usage across the system’s source. The file set is discovered by glob — adding a page or stylesheet adds it to the census automatically. Raw hex outside the registry is flagged as off-system.
143 tokens 64 registered classes 46 icons 16 unused 0 off-system colours
Generated 2026-06-19T16:18:44.743Z. Doc-only = referenced only by documentation pages. Catalogue = an icon shown in the Iconography library but not yet placed in product — available, not dead. Dynamic = matched via a template-constructed class.
01
Tokens
A token is in use when a stylesheet, component or another token references it. Unused tokens are candidates for retirement — or for the near-future work they were designed ahead of.
| Token | Group | Styles | Components | Docs | Status |
|---|---|---|---|---|---|
--brand | brand | 21 | 0 | 6 | In use |
--brand-press | brand | 8 | 0 | 0 | In use |
--brand-tint | brand | 11 | 0 | 0 | In use |
--brand-ink | brand | 3 | 0 | 0 | In use |
--ink-900 | ink | 40 | 0 | 14 | In use |
--ink-700 | ink | 14 | 0 | 3 | In use |
--ink-500 | ink | 30 | 0 | 19 | In use |
--ink-400 | ink | 21 | 0 | 11 | In use |
--ink-800 | ink | 1 | 0 | 0 | In use |
--ink-inverse | ink | 6 | 0 | 1 | In use |
--bg | surface | 1 | 0 | 7 | In use |
--surface | surface | 24 | 0 | 4 | In use |
--surface-2 | surface | 7 | 0 | 2 | In use |
--surface-3 | surface | 16 | 0 | 1 | In use |
--border | surface | 30 | 0 | 11 | In use |
--border-strong | surface | 12 | 0 | 2 | In use |
--ondark-line | ondark | 3 | 0 | 0 | In use |
--ondark-edge | ondark | 3 | 0 | 0 | In use |
--ondark-ink | ondark | 14 | 0 | 0 | In use |
--ondark-ink-2 | ondark | 7 | 0 | 0 | In use |
--ondark-ink-dim | ondark | 6 | 0 | 0 | In use |
--ondark-ink-mute | ondark | 3 | 0 | 0 | In use |
--ondark-hover | ondark | 4 | 0 | 0 | In use |
--ondark-active | ondark | 2 | 0 | 0 | In use |
--ok | status | 11 | 0 | 5 | In use |
--ok-tint | status | 9 | 0 | 1 | In use |
--ok-tint-hover | status | 1 | 0 | 0 | In use |
--manual | status | 5 | 0 | 5 | In use |
--manual-tint | status | 5 | 0 | 2 | In use |
--manual-ink | status | 1 | 0 | 0 | In use |
--manual-line | status | 1 | 0 | 0 | In use |
--block | status | 7 | 0 | 7 | In use |
--block-tint | status | 5 | 0 | 0 | In use |
--block-ink | status | 1 | 0 | 0 | In use |
--block-line | status | 2 | 0 | 0 | In use |
--skip | status | 2 | 0 | 0 | In use |
--skip-tint | status | 2 | 0 | 0 | In use |
--m-reviews | module | 0 | 0 | 3 | Doc-only |
--m-reviews-tint | module | 0 | 0 | 0 | Unused |
--m-photos | module | 0 | 0 | 0 | Unused |
--m-photos-tint | module | 0 | 0 | 0 | Unused |
--m-translation | module | 0 | 0 | 3 | Doc-only |
--m-translation-tint | module | 0 | 0 | 2 | Doc-only |
--m-locations | module | 1 | 0 | 5 | In use |
--m-locations-tint | module | 1 | 0 | 2 | In use |
--m-updates | module | 0 | 0 | 1 | Doc-only |
--m-updates-tint | module | 0 | 0 | 0 | Unused |
--m-intake | module | 0 | 0 | 0 | Unused |
--m-intake-tint | module | 0 | 0 | 0 | Unused |
--font-ui | font | 11 | 0 | 1 | In use |
--font-mono | font | 21 | 0 | 10 | In use |
--text-display | type-scale | 1 | 0 | 0 | In use |
--lh-display | type-scale | 1 | 0 | 0 | In use |
--text-page | type-scale | 2 | 0 | 7 | In use |
--lh-page | type-scale | 2 | 0 | 4 | In use |
--text-section | type-scale | 3 | 0 | 2 | In use |
--lh-section | type-scale | 1 | 0 | 0 | In use |
--text-card | type-scale | 6 | 0 | 1 | In use |
--lh-card | type-scale | 0 | 0 | 0 | Unused |
--text-body | type-scale | 2 | 0 | 1 | In use |
--lh-body | type-scale | 6 | 0 | 1 | In use |
--text-sm | type-scale | 27 | 0 | 8 | In use |
--lh-sm | type-scale | 3 | 0 | 1 | In use |
--text-meta | type-scale | 20 | 0 | 12 | In use |
--lh-meta | type-scale | 0 | 0 | 0 | Unused |
--text-micro | type-scale | 25 | 0 | 7 | In use |
--lh-micro | type-scale | 0 | 0 | 0 | Unused |
--text-ui-lg | type-scale | 9 | 0 | 0 | In use |
--w-regular | weight | 5 | 0 | 1 | In use |
--w-medium | weight | 7 | 0 | 1 | In use |
--w-semi | weight | 24 | 0 | 7 | In use |
--w-bold | weight | 7 | 0 | 1 | In use |
--w-heavy | weight | 10 | 0 | 9 | In use |
--track-label | tracking | 9 | 0 | 6 | In use |
--track-tight | tracking | 3 | 0 | 0 | In use |
--track-heavy | tracking | 3 | 0 | 6 | In use |
--space-05 | spacing | 9 | 0 | 6 | In use |
--space-1 | spacing | 7 | 0 | 11 | In use |
--space-15 | spacing | 12 | 0 | 8 | In use |
--space-2 | spacing | 33 | 0 | 37 | In use |
--space-3 | spacing | 55 | 1 | 51 | In use |
--space-4 | spacing | 35 | 0 | 62 | In use |
--space-5 | spacing | 10 | 0 | 17 | In use |
--space-6 | spacing | 15 | 0 | 37 | In use |
--space-8 | spacing | 2 | 0 | 13 | In use |
--space-10 | spacing | 1 | 0 | 7 | In use |
--space-12 | spacing | 4 | 0 | 1 | In use |
--space-16 | spacing | 2 | 0 | 3 | In use |
--radius-xs | radius | 10 | 0 | 1 | In use |
--radius-sm | radius | 15 | 0 | 4 | In use |
--radius-md | radius | 16 | 0 | 2 | In use |
--radius-lg | radius | 3 | 0 | 0 | In use |
--radius-pill | radius | 2 | 0 | 2 | In use |
--border-w | border | 47 | 0 | 11 | In use |
--border-w-hairline | border | 5 | 0 | 0 | In use |
--border-w-focus | border | 5 | 0 | 2 | In use |
--size-header | size | 3 | 0 | 0 | In use |
--size-ctl | size | 5 | 0 | 1 | In use |
--size-ctl-sm | size | 1 | 0 | 0 | In use |
--size-tile | size | 8 | 0 | 0 | In use |
--size-sidenav | size | 1 | 0 | 0 | In use |
--shadow-sm | elevation | 4 | 0 | 0 | In use |
--shadow-md | elevation | 5 | 0 | 2 | In use |
--shadow-pop | elevation | 3 | 0 | 1 | In use |
--glass-bg | glass | 2 | 0 | 0 | In use |
--glass-bg-solid | glass | 1 | 0 | 0 | In use |
--glass-blur | glass | 6 | 0 | 0 | In use |
--glass-saturate | glass | 6 | 0 | 0 | In use |
--glass-border | glass | 3 | 0 | 0 | In use |
--glass-hi | glass | 1 | 0 | 0 | In use |
--glass-shadow | glass | 3 | 0 | 0 | In use |
--glass-input-bg | glass | 1 | 0 | 0 | In use |
--glass-input-bg-focus | glass | 1 | 0 | 0 | In use |
--glass-input-line | glass | 1 | 0 | 0 | In use |
--glass-inset-line | glass | 4 | 0 | 0 | In use |
--glass-inset-bg | glass | 2 | 0 | 0 | In use |
--z-shell | z-index | 3 | 0 | 0 | In use |
--z-pop | z-index | 1 | 0 | 1 | In use |
--z-overlay | z-index | 1 | 0 | 0 | In use |
--z-toast | z-index | 0 | 0 | 0 | Unused |
--focus-ring | focus | 7 | 0 | 0 | In use |
--ease-standard | ease | 28 | 0 | 2 | In use |
--ease-out | ease | 17 | 0 | 3 | In use |
--ease-in | ease | 1 | 0 | 0 | In use |
--ease-in-out | ease | 9 | 0 | 2 | In use |
--ease-settle | ease | 3 | 0 | 0 | In use |
--ease-glide | ease | 2 | 0 | 1 | In use |
--ease-smooth | ease | 9 | 0 | 4 | In use |
--dur-instant | duration | 1 | 0 | 0 | In use |
--dur-fast | duration | 27 | 0 | 1 | In use |
--dur-base | duration | 15 | 0 | 3 | In use |
--dur-slow | duration | 0 | 0 | 0 | Unused |
--dur-morph | duration | 7 | 0 | 3 | In use |
--dur-tag | duration | 4 | 0 | 2 | In use |
--dur-page | duration | 9 | 0 | 2 | In use |
--dur-curve | duration | 0 | 0 | 1 | Doc-only |
--dur-grow | duration | 0 | 0 | 0 | Unused |
--dur-roll | duration | 0 | 0 | 0 | Unused |
--dur-scroll-min | duration | 0 | 0 | 0 | Unused |
--dur-scroll-max | duration | 0 | 0 | 0 | Unused |
--stagger | duration | 1 | 0 | 2 | In use |
--ease alias | alias | 2 | 0 | 0 | In use |
--dur alias | alias | 10 | 0 | 0 | In use |
02
Classes
Every km-* product class and ds-* shell class is registered; the manifest is reconciled against markup across the app.
| Selector | Title | Layer | Defined in | Uses | Status |
|---|---|---|---|---|---|
.km | Product base | element | components/base.css | 85 | In use |
.km-subtext | Subtext | element | components/base.css | 18 | In use |
.km-header | App header | component | components/header.css | 12 | In use |
.km-tab | Top tab | component | components/header.css | 9 | In use |
.km-sidenav | Side nav | component | components/sidenav.css | 0 | Unused |
.km-btn | Button | element | components/button.css | 31 | In use |
.km-link | Link | element | components/button.css | 56 | In use |
.km-card | Card / panel | component | components/card.css | 98 | In use |
.km-loc | Location card | component | components/card.css | 27 | In use |
.km-field | Detail field row | object | components/card.css | 83 | In use |
.km-chip | Status chip | element | components/chip.css | 10 | In use |
.km-plat | Platform tile | element | components/chip.css | 3 | In use |
.km-assignee | Assignee pill | object | components/chip.css | 8 | In use |
.km-label | Field label | element | components/form.css | 8 | In use |
.km-input | Text input | element | components/form.css | 5 | In use |
.km-textarea | Textarea | element | components/form.css | 4 | In use |
.km-select | Select | element | components/form.css | 3 | In use |
.km-hint | Field hint | element | components/form.css | 4 | In use |
.km-seg | Segmented control | element | components/form.css | 5 | In use |
.km-composer | Voice composer | component | components/form.css | 5 | In use |
.km-bubble | Intake bubble | component | components/conversation.css | 13 | In use |
.km-confirm | Confirmation card | component | components/conversation.css | 17 | In use |
.km-check | Processing checklist | component | components/conversation.css | 22 | In use |
.km-feed | Activity feed | component | components/conversation.css | 33 | In use |
.km-empty | Empty state | component | components/feedback.css | 18 | In use |
.km-banner | Banner | component | components/feedback.css | 14 | In use |
.km-table | Dense table | component | components/table.css | 24 | In use |
.km-metric-hero | Hero workload metric | object | components/reviews.css | 12 | In use |
.km-facet | Filter facet | object | components/reviews.css | 27 | In use |
.km-stars | Star rating | element | components/reviews.css | 4 | In use |
.km-quote | Quote block | element | components/reviews.css | 7 | In use |
.km-dotline | Dot-separated meta line | object | components/reviews.css | 17 | In use |
.km-review | Review card | component | components/reviews.css | 32 | In use |
.km-dropdown | Dropdown menu | overlay | components/dropdown.css | 8 | In use |
.km-glass | Glass material | overlay | components/glass.css | 1 | In use |
.km-lift | Card lift | effect | components/motion-effects.css | 5 | In use |
.km-tilt | 3D tilt | effect | components/motion-effects.css | 1 | In use |
.km-glow | Cursor-follow glow | effect | components/motion-effects.css | 1 | In use |
.km-meter | Meter | effect | components/motion-effects.css | 4 | In use |
.km-skeleton | Skeleton | effect | components/motion-effects.css | 5 | In use |
.km-palette | Command palette | effect | components/motion-effects.css | 5 | In use |
.km-drawer | Parallax drawer | effect | components/motion-effects.css | 8 | In use |
.km-checkdraw | Status celebration | effect | components/motion-effects.css | 2 | In use |
.km-ic-spin | Icon micro-motions | effect | components/motion-effects.css | 9 | In use |
.km-empty--ambient | Ambient empty state | effect | components/motion-effects.css | 13 | In use |
.km-ai | AI generation motion | effect | components/motion-effects.css | 7 | In use |
.km-overlay | Overlay | overlay | components/dialog.css | 4 | In use |
.km-dialog | Dialog | overlay | components/dialog.css | 64 | In use |
.ds-doc | Doc frame | shell | shell.css | 2 | In use |
.ds-nav | Doc nav | shell | shell.css | 6 | In use |
.ds-sec | Doc section | shell | shell.css | 41 | In use |
.ds-prose | Doc prose | shell | shell.css | 206 | In use |
.ds-cover | Doc cover | shell | shell.css | 48 | In use |
.ds-exec | Executive callout | shell | shell.css | 4 | In use |
.ds-demo | Demo stage | shell | shell.css | 251 | In use |
.ds-principle | Principle card | shell | shell.css | 27 | In use |
.ds-sw | Token swatch | shell | shell.css | 16 | In use |
.ds-ramp | Type ramp row | shell | shell.css | 9 | In use |
.ds-scale | Spacing scale | shell | shell.css | 4 | In use |
.ds-radius-box | Radius box | shell | shell.css | 2 | In use |
.ds-split | Split layout | shell | shell.css | 14 | In use |
.ds-tbl | Doc table | shell | shell.css | 17 | In use |
.ds-tag | Doc tag | shell | shell.css | 11 | In use |
.ds-lab-sandbox | Labs sandbox wrapper | shell | shell.css | 1 | In use |
03
Icons
Catalogue-only icons are available capacity, not dead weight — the library was designed ahead of need.
| Icon | Label | Group | Uses | Status |
|---|---|---|---|---|
krown | Krown K | Platform | 16 | In use |
google | Platform | 18 | In use | |
apple | Apple | Platform | 14 | In use |
microsoft | Microsoft (closest mark for Bing) | Platform | 15 | In use |
chevron-right | Caret right | Direction | 1 | In use |
chevron-left | Caret left | Direction | 0 | Catalogue |
chevron-up | Caret up | Direction | 0 | Catalogue |
chevron-down | Caret down | Direction | 1 | In use |
arrow-right-circle | Arrow right circle | Arrows in circles | 0 | Catalogue |
arrow-left-circle | Arrow left circle | Arrows in circles | 0 | Catalogue |
arrow-up-circle | Arrow up circle | Arrows in circles | 1 | In use |
arrow-down-circle | Arrow down circle | Arrows in circles | 0 | Catalogue |
arrow-right | Arrow right (bold mark, drawn) | Arrows | 0 | Catalogue |
arrow-left | Arrow left (bold mark, drawn) | Arrows | 0 | Catalogue |
arrow-up | Arrow up (bold mark, drawn) | Arrows | 0 | Catalogue |
arrow-down | Arrow down (bold mark, drawn) | Arrows | 0 | Catalogue |
external | External / open (arrow-up-right, bold mark) | Arrows | 3 | In use |
search | Search (bold mark, drawn) | Find | 1 | In use |
filter | Filter (funnel-fill) | Find | 0 | Catalogue |
sort | Sort (bold mark, drawn) | Find | 0 | Catalogue |
check-circle | Check circle fill | Status | 7 | In use |
x-circle | X circle fill | Status | 1 | In use |
alert-triangle | Exclamation triangle fill | Status | 5 | In use |
info-circle | Info circle fill | Status | 5 | In use |
clock | Clock fill | Status | 0 | Catalogue |
check | Check (bold mark) | Marks | 2 | In use |
x | Close (bold mark) | Marks | 8 | In use |
plus | Add (bold mark) | Marks | 3 | In use |
minus | Remove (bold mark) | Marks | 0 | Catalogue |
menu | Menu (bold mark) | Marks | 0 | Catalogue |
edit | Edit (pencil-fill) | Actions | 1 | In use |
trash | Delete (trash-fill) | Actions | 1 | In use |
copy | Copy (two sheets, filled outline) | Actions | 0 | Catalogue |
settings | Settings (gear-fill) | Actions | 0 | Catalogue |
refresh | Refresh (filled outline) | Actions | 4 | In use |
mic | Microphone (mic-fill) | Actions | 2 | In use |
pin | Location (geo-alt-fill) | Wayfinding | 0 | Catalogue |
calendar | Calendar (calendar-fill) | Wayfinding | 0 | Catalogue |
bell | Notifications (bell-fill) | Wayfinding | 1 | In use |
user | User (person-fill) | Wayfinding | 0 | Catalogue |
building | Business (building-fill) | Wayfinding | 0 | Catalogue |
link | Link (solid interlocked rings, drawn) | Wayfinding | 0 | Catalogue |
more | More (three-dots) | Wayfinding | 2 | In use |
quote | Quotation mark (double, quote) | Content | 2 | In use |
star-fill | Star (filled — score) | Rating | 1 | In use |
star | Star (hollow — remainder) | Rating | 1 | In use |
04
Off-system colours
Raw hex anywhere outside the registry misses the token layer. The goal is zero.
No off-system colours
Every colour in the app routes through the token registry.