Design-DNA Skill – Tokens & Patterns

This skill provides shared understanding of design-dna for all lanes.

It is used by:

• design-system-architect
• Implementation agents (e.g. nextjs-builder, expo-builder) when applying tokens
• Gate agents (nextjs-standards-enforcer, design QA) when checking usage

Core Concepts

• design-dna.json encodes:
  • Color palette + semantic roles,
  • Typography scale and roles,
  • Spacing grid,
  • Named patterns (cards, layouts, shells, etc.).
• It is the law for UI work: where tokens exist, ad-hoc values are forbidden.

Usage Pattern