insigle — system reference

The single consultable surface for the design system: colour foundations, type, iconography, the deck system, and brand motion. Product proof lives in preview.html, the deck in deck-preview.html. Authoritative hex always comes from PALETTE.generated.md — never transcribe by hand.

Foundations

Colour primitives, status ramps, semantic roles, and the two reserved colour families. These are the bedrock every other surface inherits from tokens.css.

Primitives — neutral

Primitives — UI accent (de-neoned indigo, hue 272)

Status ramps

success

warning

danger

info

Brand & deck colour — two reserved families

Brand — logo / motion / export only

Deck — data-viz only

Brand constantsUsed for logo, motion and export only — never UI chrome.

Deck huesData-viz only — never a UI state. Selection is the accent's job.

Electric #3B30E8Motion / reveal only. Static chrome stays monochrome.

Semantic tokens

Notion shortlist (paste-ready)

A short role→token list for pasting into Notion. Full hex stays in PALETTE.generated.md.

Role	Token
Brand ink / paper / electric	--brand-ink · --brand-paper · --brand-electric
App background	--bg
Surface (card)	--surface
Text · secondary	--fg · --fg-muted
Accent (UI) · accent text	--accent · --accent-text
Success / warning / danger / info	--{success\|warning\|danger\|info}-solid

Type

The canonical type scale and font roles — this is the single source for typography. Downstream artifacts (brand book, deck) reference it; they do not redefine it.

Display 48

Heading 30

Body large 18 — calm, exact long-form text.

Body 16 — the product default.

Caption 12 / meta — timestamps, captions.

mono · const placement = "frg_8c21"; // Geist / JetBrains

InterUI, headlines, body, table and chart figures — the workhorse.

Geist / JetBrains MonoIDs, sources, page digits, inline URLs / RFC / paths.

Space GroteskLogo lockups only — never page or product copy.

Iconography

Product / UI / deck-utility icons come from IconPark (icon-park-outline, Apache-2.0). Full spec: iconpark-mapping-spec.md.

Conventionoutline theme · 48-grid · stroke 3.2 (2.75–3.5) · round caps/joins · currentColor.

Outline onlyNo decorative fills, no duotone or multicolour variants in product chrome.

Never IconPark forThe :l, wordmark, logo tiles, favicon or motion — those are bespoke.

UI function	IconPark name	Token
Dashboard nav	dashboard	currentColor
Sites & fragments nav	globe	currentColor
Cards nav	card-two	currentColor
Reporting nav	chart-histogram	currentColor
Lab / Brand Radar nav	experiment	currentColor
Settings nav	setting	currentColor
Search	search	--fg-subtle
Theme toggle	switch-themes	currentColor
New card	plus	currentColor
Edge / API block	api	--fg-meta
Agent request receipt	transaction-order	--fg-meta
Brand Radar match	radar	--accent-text
Served status	check-small	--success-fg
No-fill status	caution	--warning-fg
Error status	error	--danger-fg
Source / provenance	tag	--fg-meta
Code / snippet	code-brackets	--fg-meta

Deck System

Light Primary · Dark Secondary

One deck system, two themes — Light is primary (client handoff), Dark is secondary (premium alternate). Slides are 1920×1080, built ×1.714 from the 1120px master (content padding 123px). Spec: orchestration/deck-style-model.md. Source of truth: deck-preview.html + renders/insigle-deck-{dark,light}.pdf. The specimens below are the reference — Figma mirrors them.

Theme hierarchy

Light · Primary

Reporting that
stays exact.

muted #5E6067 · dim #787A82

Dark · Secondary

Reporting that
stays exact.

muted #ABAEB6 · dim #8B8D95

bg #F2F5FE / #0B0D14 · text #201C4A / #F2F5FE · one accent per slide.

Type roles in deck

Market shift · 2026

Headline — Inter, tight tracking

Body — Inter, calm and exact. One idea per slide.

source — figma.com/insigle · RFC 0042

Eyebrow neutral, UPPERCASE, +14% tracking. Mono only for sources / IDs / digits / paths.

Chrome placement

Mechanism

Confidential

Five agents,
one ledger.

source — insigle.internal

CONFIDENTIAL top-right · source bottom-left (mono) · :l + 2-digit page bottom-right. Cover unnumbered → 01–06.

Chart — 7-day stacked

Mon–Sun stacked, quiet indigo ramp #8ea4ff→#343a54 — no rainbow. Five agent series.

Table figures

Agent	Served	No-fill	Rate
Atlas	1,204	38	96.9%
Beacon	987	12	98.8%
Cedar	1,556	61	96.2%

Figures in Inter, tabular-nums. Hairline rules only — no heavy grid.

Imagery & scrim

Dark — duotone + ink scrim + overlay

Light — duotone + paper scrim

Duotone only. Light uses *-duo-lt + paper scrim; Dark uses *-duo + ink scrim + ink overlay.

Appendix readability

Sources

Cloudflare Radar, 2026 · radar.cloudflare.com

Claim · agent fill rate

Internal telemetry, 90-day window · RFC 0042

Method

Stacked daily served vs. no-fill, five agents.

UPPERCASE tracked-grey eyebrows + hairline rules. Keep text readable in export — bump locally if thinned.

Motion

the :l moment

The mark's one moment of life: the :l cursor blinks electric only while a state is loading, then settles monochrome. Static chrome never carries electric.

Empty state

Mark at rest — monochrome, no motion.

Loading state

Live cursor — electric only while alive, settles mono.