16989d834cb5517fad3b297d18b1092997f90e01
Lint / lint (push) Has been cancelled
Initial repository scaffold: - design.md (google-labs-code/design.md format) as canonical token + guidelines source - brand assets, foundations, tokens (W3C-style JSON) - 12 component primitives, each with labeled anatomy.svg and spec README - light / dark / high-contrast themes, web/mobile/email/print/presentation templates - docs (getting started, principles, a11y, voice & tone, contributing) - runnable web example, token build script stub, CI placeholder Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
KDC Design System
The official design system for KDC — tokens, components, brand assets, and guidelines for building consistent KDC 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.
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, icons, illustrations, images, patterns
├── 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: alpha. Tokens and components are still settling — expect breaking changes.
Contributing
Description
Languages
CSS
87.4%
JavaScript
12.6%