5c6d703774075dd989ec86f84514f8a5866e05fa
Lint / lint (push) Has been cancelled
- Restructure assets/icons: drop ui/, rename outline->regular, filled->fill, add bold/ - Pull 80 Phosphor icons in regular weight (all) + fill weight (all) + bold (status set) - Include Phosphor MIT LICENSE - Rewrite icons README with folder map, specs, usage examples, contribution rules Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
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
- Read
docs/getting-started/README.md. - Skim
design.mdfor the token vocabulary. - Pick your platform under
examples/.
Status
Version: beta. Tokens and components are still settling — expect breaking changes.
Contributing
Description
Languages
CSS
87.4%
JavaScript
12.6%