Brand kit
Community semantic colors
Click any token to see it in context. Tokens are meaningless without usage — this explorer shows where each one appears.
#1a1917
rgba(255,255,255,0.07)
#201f1c
#262421
#2a2418
#262521
#302e29
#353330
#e4e0d8
#2c2a26
#221f1c
#332d1f
#3d3628
#453e30
#201f1c
#2a2825
#302e29
#353330
#ffffff
#e4e0d8
#ffffff
#9a9589
#7a756a
#6a6560
#e4e0d8
#ffffff
#c4bfb4
#9a9589
#1a1917
#161513
#1a1917
#e4e0d8
#c4bfb4
#c9b99a
#262521
#302e29
#353330
#201f1c
#2a2825
#353330
#ffffff
#e4e0d8
#c4bfb4
rgba(255,255,255,0.08)
rgba(255,255,255,0.12)
rgba(255,255,255,0.18)
#c9b99a
#d9ccb3
#b0a286
#4ade80
#22c55e
rgba(74,222,128,0.12)
rgba(74,222,128,0.18)
#f0fdf4
#ef4444
#dc2626
rgba(239,68,68,0.12)
rgba(239,68,68,0.18)
#fef2f2
#f59e0b
#d97706
rgba(245,158,11,0.12)
rgba(245,158,11,0.18)
#fffbeb
#60a5fa
#3b82f6
rgba(96,165,250,0.12)
rgba(96,165,250,0.18)
#eff6ff
#4ade80
rgba(74,222,128,0.12)
#f0fdf4
#1a1917
#201f1c
#262521
#302e29
rgba(255,255,255,0.07)
#c9b99a
#6a6560
rgba(255,255,255,0.08)
#ffffff
#ffffff
#2c2a26
rgba(74,222,128,0.12)
rgba(239,68,68,0.12)
rgba(245,158,11,0.12)
rgba(96,165,250,0.12)
#2c2a26
#9a9589
rgba(255,255,255,0.07)
rgba(255,255,255,0.11)
rgba(255,255,255,0.07)
rgba(255,255,255,0.11)
rgba(255,255,255,0.15)
rgba(201,185,154,0.45)
rgba(255,255,255,0.04)
transparent
#c9b99a
#d9ccb3
#b0a286
rgba(201,185,154,0.45)
#302e29
rgba(0,0,0,0.6)
#ffffff
#1a1917
Community
Coherence layer
Semantic tokens drive every surface — switch light / dark to compare.
Surfaces
Default
Card on bg
Subdued
Secondary
Selected
Active row
Body text — content token.
Muted — captions, helper.
Primary ink — emphasis.
Inline link in context.
Inverse surface
Muted on inverse
Table
| Name | Status |
|---|---|
| Roadmap surface | Active |
| Token explorer | Selected |
Form
List
- WP-211 Community launch 1
- WP-203 Roadmap surface 2
- TEN-918 Visual identity 3
Loading
Implementation note
Community, marketing, and blog pages use data-theme="parchment-marketing-light" with warm tokens
from zen-tokens.css. The brand-tokens.json SSOT
(DEC-419) defines 4 variants: parchment light/dark and graphite light/dark.
Workspace views switch between all 4 via the theme picker. This showcase defaults to parchment.