kyn®
ACTIVE DESIGN SYSTEM · AI AGENT PLATFORM · DARK-FIRST

The system
behind kyn.

A focused token set for an agent platform: live runs, history, logs. Built on a black canvas with a single orange signal, beveled surfaces, and a typographic system that holds equally well in a 12px log row and a 160px hero.

PALETTE Black · White · Orange
TYPE Geist / Geist Mono
SURFACES Beveled, layered
VERSION 0.1.0 · MAY 2026
AMBIENT DISPLAY · TYPE AS TEXTURE kyn
01

Color

Black ground, warm white type, one signal orange. Status hues are oklch-tuned to share lightness so they sit calmly together.

SIGNAL · BRAND ACCENT
Orange / 50#FFF3EC
Orange / 300#FF8A4B
Orange / 500 - primary#FF4D17
Orange / 700#B5310A
SURFACES · DARK STACK
Surface 0#08090A
Surface 1#0E0F11
Surface 2#14161A
Surface 3#1B1E23
Surface 4#23272E
Line#2A2E36
INK · TEXT
Ink 1#F4F1EC
Ink 2#C7C4BD
Ink 3#8E8B85
Ink 4#5A5853
STATUS · CALIBRATED OKLCH
StrongL0.78 · H150
MixedL0.78 · H70
EmergingL0.74 · H295
DividedL0.74 · H25
Weak / neutralL0.65 · H80
02

Typography

Geist holds a wide voice: confident at display, calm at body. Geist Mono carries technical surfaces (timestamps, ids, eyebrows, log streams).

DISPLAY · AMBIENT Geist 500 · 168 / 0.9 · −0.045em Hero, section opener.
Real-time agents.
DISPLAY · LARGE Geist 500 · 64 / 1 · −0.035em Page titles, hero supports.
Trending runs today
DISPLAY · MEDIUM Geist 500 · 40 / 1.05 · −0.035em Section headers.
A typographic system you can trust at 12px.
H1 · H2 · H3 Geist 600 · 32 / 22 / 17
Agent observability
Run · auth-flow-inspector
Tool result · cache:report
BODY · BODY-SM · META Geist 400 · 15 / 13 / 12

An autonomous agent interprets the request, plans tool calls, executes them in sequence, and synthesizes a structured response. Each step streams to the live activity panel.

Smaller body sizes step down by 2px and lose a notch of color weight to keep the hierarchy legible without bolding.

Meta · ids, footnotes, captions.

EYEBROW · MONO Geist Mono 500 · 11 · 0.12em · UPPER
RESEARCH · ACCELERATING ● LIVE · 3 AGENTS UPDATED 2H AGO
MONO · TECHNICAL Geist Mono 400 · 13
28:37.23  tool.result  cache:report  Tirzepatide - cached · 0ms
03

Space & shape

A 4px ramp underpins everything. Radius is generous on cards (16px) and full-pill on actions, echoing the pill-button voice from relats.

SPACING · 4PX BASE--s-1 → --s-32
1·4
2·8
3·12
4·16
6·24
8·32
12·48
16·64
24·96
32·128
RADIUS4 · 8 · 12 · 16 · 20 · pill
4
8
12
16
20
pill
BEVEL · ELEVATIONinset highlight + drop
BEVEL
subtle inner highlight, soft inner floor
CARD
bevel + drop shadow
04

Components

Action language is calm. Orange is reserved for primary intent and live signal; everything else is held in greyscale.

BUTTONS · PILL · PRIMARY / GHOST / QUIET .btn .btn-primary .btn-ghost .btn-quiet
STATUS BADGES · LABELLED PILLS .badge.badge-{strong|mixed|emerging|divided|weak|orange}
SIGNALHIGH
CONSENSUSSTRONG
SENTIMENTMIXED
RESEARCHACCELERATING
RISKDIVIDED
RUNQUEUED
LIVE
STREAMING
● TRENDING
SEARCH · COMMAND.kyn-search
CATEGORY CHIPS.btn.btn-quiet
CARD · BEVELED · STAT GRID.kyn-card .statgrid .stat-cell
RUN · 0247 LIVE
auth-flow-inspector
also: oauth-debug, sso-trace

Inspects an auth flow end-to-end. Captures redirects, token exchanges, and cookie state across hops.

SIGNALHIGH
SENTIMENTSTABLE
RESEARCHACTIVE
RISKMEDIUM
PROGRESS · STEP 4 / 7 +57%
RISK MODERATE View intelligence →
● AGENT ACTIVITY LIVE
28:37.10tool.result cache:report Tirzepatide - cached · 0ms
28:37.23tool.result cache:report Semaglutide - cached · 0ms
28:37.28tool.call http.get peptdb.io/v1/c/
28:37.33tool.retry backoff 240ms · attempt 2
28:37.38tool.result cache:report AOD-9604 - cached · 0ms
28:37.43replay synthesizing report [synthesize]
28:37.59report.ready 5 structured briefs
28:37.59■ stream closed
05

In situ · Live run

The system on a real surface. Same tokens, same components, composed into the agent stream the app actually ships.

kyn.app/run/0247
LIVE
RUN · 0247 STREAMING

auth-flow-inspector

Tracing redirects and token exchanges for acme-corp.com · started 02:14 ago

01
Plan tool sequence
3 tools queued · model.geist-3.haiku
DONE
02
Fetch /authorize endpoint
http.get · 312ms · 200 OK
DONE
03
Capture redirect chain
5 hops · 2 cookies · 1 cross-domain
DONE
04
Decode token exchange
jwt.parse · in flight · 1.8s
RUNNING
05
Cross-reference IDP claims
queued
QUEUED
06
Synthesize trace report
queued
QUEUED
DISCUSSION VELOCITY · 24-WEEK +248%
● AGENT ACTIVITY 13 events
02:14.10tool.result http.get /authorize · 312ms
02:14.31trace.hop acme-idp.com → acme-app.com
02:14.38cookie.set __Host-Session · SameSite=Strict
02:14.52jwt.warn aud claim missing
02:14.66tool.call jwt.parse in flight
02:14.68▌ stream open
06

In situ · Run history

Same system, dense data surface. Mono in the technical columns; pill statuses; ample row height to read at a glance.

Run history · 24 RUNS · LAST 7 DAYS
ID Agent Status Started Duration Events
0247 auth-flow-inspector LIVE 02:14 ago 2.1s 13
0246 data-extractor DONE 14m ago 8.4s 42
0245 support-triager PARTIAL 38m ago 12.0s 81
0244 code-reviewer DONE 1h ago 3.7s 19
0243 billing-reconciler FAILED 2h ago 0.9s 4
0242 onboarding-coach DONE 3h ago 14.2s 63
0241 doc-summarizer REPLAY 5h ago 6.0s 28