Documentation

Basics

DESIGN.md Schema

Understand the expected output structure and how generated documentation is organized.

Why schema matters

Generated docs are easiest to review and iterate when they follow a predictable shape. FT DesignSpec enforces a multi-section structure so humans and AI tools can parse output consistently.

Core sections

1. Brand Summary

High-level identity, positioning, and intent.

2. Color Tokens

Named tokens, roles, and usage expectations.

3. Typography

Font families, scale, and usage hierarchy.

4. Components

Common UI patterns, states, and implementation notes.

5. Spacing and Layout

Spacing scales, layout rhythm, and responsive concerns.

6. Elevation and Effects

Shadow treatments, depth decisions, and interaction transitions.

7. Voice and Content

Writing style, tone, and microcopy directions.

8. Accessibility and QA

Color contrast notes, interaction requirements, and verification checklist.

9. Agent Prompt Guide

Prompts and constraints to help AI generate aligned UI work from the design system.

See rules/schema.md for the canonical rule pack used to steer generation behavior.