DESIGN.md는 Google Labs의 Stitch가 개발한 오픈 표준으로, AI 에이전트가 브랜드의 디자인 시스템 규칙을 명시적으로 파악할 수 있도록 프로젝트에 포함하는 구조화된 파일 형식이다. 2026년 4월 21일 오픈소스로 공개되었으며, GitHub에서 초안 스펙에 기여할 수 있다.
등장 배경
AI 에이전트가 UI를 생성할 때 가장 큰 문제는 “의도를 추측해야 한다”는 점이다. 특정 색상이 왜 그 용도로 쓰이는지, WCAG 접근성 규칙이 어떻게 적용되어야 하는지, 어떤 컴포넌트가 어떤 상황에 맞는지 — 이 모든 맥락이 사라진다.
DESIGN.md는 이 맥락을 명시적으로 기록해 에이전트가 추측 대신 알고 선택할 수 있게 한다.
핵심 개념
- 색상 의미 문서화:
#1B365D가 단순히 “파란색”이 아니라 “기본 CTA 컬러”임을 명시 - 접근성 규칙: WCAG 규칙을 에이전트가 선택을 검증할 수 있는 형태로 인코딩
- 컴포넌트 가이드라인: 어떤 상황에 어떤 컴포넌트를 써야 하는지 기술
- 플랫폼 독립: Stitch뿐 아니라 모든 AI 코딩 도구에서 사용 가능
사용 방법
Stitch에서 프로젝트의 디자인 규칙을 설정하면 DESIGN.md로 내보낼 수 있다. 이 파일을 저장소에 포함하면 다음 프로젝트나 다른 도구에서 동일한 디자인 규칙을 재사용할 수 있다. 반대로 외부에서 만든 DESIGN.md를 Stitch에 임포트하는 것도 가능하다.
project/
├── DESIGN.md ← 디자인 시스템 규칙 (AI 가독 형태)
├── CLAUDE.md ← Claude Code 프로젝트 지시 파일
└── src/GitHub 저장소
초안 스펙은 github.com/google-labs-code/design.md에서 확인하고 기여할 수 있다.
관련 문서
- a2ui — 에이전트가 기존 디자인 시스템으로 UI를 생성하는 표준
- gpt-54-tips-frontend — GPT-5.4를 활용한 프론트엔드 설계
참고 자료
- Stitch’s DESIGN.md format is now open-source — Google Blog (2026-04-21)