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>
47 lines
2.3 KiB
Markdown
47 lines
2.3 KiB
Markdown
# Kode Design Consultants — Design System
|
||
|
||
The official design system for **Kode Design Consultants Ltd** (KDC) — tokens, components, brand assets, and guidelines for building consistent product and brand experiences.
|
||
|
||
> The single source of truth lives in [`design.md`](./design.md), which encodes the design tokens (colors, typography, spacing, radii, components) in the [google-labs-code/design.md](https://github.com/google-labs-code/design.md) format.
|
||
|
||
## Brand at a glance
|
||
|
||
| | |
|
||
|--|--|
|
||
| Wordmark | `kode` set in **Opificio Bold** (72pt / 52pt) |
|
||
| Secondary line | `design consultants` in **Manrope ExtraLight** (20pt / 76pt) |
|
||
| Brand color | Kode purple `#6B35A7` |
|
||
| Supporting | Black `#000000`, White `#FFFFFF`, Off-white `#F5F4F0` |
|
||
| UI typeface | **Manrope** (200–800) |
|
||
|
||
## Repository structure
|
||
|
||
```
|
||
KDCDesignSystem/
|
||
├── design.md # Canonical token + guidelines spec
|
||
├── brand/ # Logos, wordmarks, brand guidelines
|
||
├── tokens/ # Generated/exported design tokens
|
||
├── foundations/ # Color, type, spacing, motion, grid, breakpoints
|
||
├── assets/ # Fonts (Manrope + Opificio), icons, illustrations
|
||
├── components/ # Per-component specs and anatomy
|
||
├── themes/ # Light, dark, high-contrast theme overrides
|
||
├── templates/ # Web, mobile, email, print, presentation
|
||
├── docs/ # Getting started, principles, a11y, voice & tone
|
||
├── examples/ # Reference implementations
|
||
└── scripts/ # Token build / export scripts
|
||
```
|
||
|
||
## Quick start
|
||
|
||
1. Read [`docs/getting-started/README.md`](./docs/getting-started/README.md).
|
||
2. Skim [`design.md`](./design.md) for the token vocabulary.
|
||
3. Pick your platform under [`examples/`](./examples/).
|
||
|
||
## Status
|
||
|
||
Version: **1.0.0** (reconciled 2026-05-17). Canonical palette and components match the production implementations in `kdcsurveyadd`, `kdcvault`, and `kdc_void_planner`. See [`docs/consolidation-2026-05.md`](./docs/consolidation-2026-05.md) for the cross-repo audit and outstanding drift in `kdcdiary` / `kdctracker` / `kdcdocs` / `kdcmapper`.
|
||
|
||
## Contributing
|
||
|
||
See [`docs/contributing/README.md`](./docs/contributing/README.md).
|