Paul Roberts
6593bdf689
Extracted real production usage from 8 KDC repos and consolidated the consensus (kdcsurveyadd / kdcvault / kdc_void_planner) into the canonical design.md + tokens. Highlights: - brand.ink #000000 -> #1A1530 (purple-tinted, matches real usage) - brand.canvas #F5F4F0 -> #F7F4ED (warm) - neutral ramp rebuilt around ink (purple-tinted, not cold slate) - semantic palette retuned for warm canvas + soft tints - elevation shadows retinted with brand-ink rgb - new accent.gold (product) and accent.mint (marketing) tokens - real themes/light, themes/dark, themes/high-contrast - fleshed out every component + foundation README - docs/consolidation-2026-05.md captures the full audit + drift inventory Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2.5 KiB
2.5 KiB
Color Swatches
Brand palette
| Token | Hex | Use |
|---|---|---|
brand.primary |
#6B35A7 |
Kode purple — primary brand colour, links, primary actions. |
brand.primaryHover |
#5C2D90 |
Hover state on brand.primary surfaces. |
brand.primaryPressed |
#45216E |
Pressed / deepest variant. |
brand.primaryLight |
#8456C2 |
Gradient end, dark-mode primary. |
brand.primarySoft |
#F1E9F8 |
Tinted surface for chips, callouts, focus halos. |
brand.ink |
#1A1530 |
Brand ink — high-emphasis text. Not pure black. |
brand.canvas |
#F7F4ED |
Warm off-white — default page surface. |
brand.canvasCool |
#F7F6FB |
Cool off-white — marketing dashboard only. |
neutral.0 |
#FFFFFF |
Pure white — cards, modals, top-bar. |
Accent
| Token | Hex | Use |
|---|---|---|
accent.gold |
#C9892B |
Product emphasis CTA (one per surface). |
accent.goldStrong |
#A86F1F |
Pressed / dark text on gold-soft. |
accent.goldSoft |
#F5E9D2 |
Background for accent chips and warning pills. |
accent.mint |
#46C194 |
Marketing accent — workspace dashboard only. |
Neutral ramp (purple-tinted)
| Token | Hex | Role |
|---|---|---|
neutral.0 |
#FFFFFF |
Pure surface |
neutral.50 |
#FBF8F1 |
Inset / secondary surface |
neutral.100 |
#F7F4ED |
= brand.canvas |
neutral.150 |
#ECE9F3 |
Cool subtle line |
neutral.200 |
#E6E0D2 |
Hairline border |
neutral.300 |
#D4CCB8 |
Strong border |
neutral.400 |
#A39DB0 |
Disabled / placeholder |
neutral.500 |
#8C869C |
Muted meta text |
neutral.600 |
#6B647A |
Mute text |
neutral.700 |
#4A4360 |
Soft ink |
neutral.800 |
#3A2D5A |
Secondary ink |
neutral.900 |
#1A1530 |
= brand.ink |
neutral.1000 |
#000000 |
Pure black (sparingly) |
Semantic
| Token | Hex | Soft tint |
|---|---|---|
semantic.success |
#2F7A5A |
#E2F0E8 |
semantic.warning |
#C9892B |
#F5E9D2 |
semantic.danger |
#B0382F |
#F7E4E1 |
semantic.info |
#5C2D90 |
#F1E9F8 |
Brand-scale (Tailwind compatibility)
| Token | Hex |
|---|---|
scale.brand-50 |
#F3EDFB |
scale.brand-100 |
#E6DAF7 |
scale.brand-200 |
#F1E9F8 |
scale.brand-500 |
#6B35A7 (= brand.primary) |
scale.brand-600 |
#5D2C93 |
scale.brand-700 |
#52287F |
scale.brand-800 |
#45216E |