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, which encodes the design tokens (colors, typography, spacing, radii, components) in the 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.
2. Skim design.md for the token vocabulary.
3. Pick your platform under 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 for the cross-repo audit and outstanding drift in kdcdiary / kdctracker / kdcdocs / kdcmapper.

Contributing

See docs/contributing/README.md.