awesome-design-md: DESIGN.md 파일 하나로 AI가 실제 웹사이트 디자인 언어를 학습하게 하는 큐레이션
VoltAgent/awesome-design-md
프로젝트 소개
Google Stitch가 제안한 DESIGN.md 개념을 기반으로, 실제 웹사이트에서 추출한 디자인 시스템 문서를 모은 저장소다. 마크다운 형식의 이 파일에는 색상, 타이포그래피, 레이아웃 패턴 등 시각적 규칙이 텍스트로 정의되어 있어, AI 코딩 에이전트가 이를 읽고 일관된 UI를 생성할 수 있다.
Figma 내보내기나 복잡한 JSON 스키마 없이 마크다운 파일 하나만 프로젝트 루트에 넣으면 된다. LLM이 가장 잘 이해하는 형식이라 별도의 파싱이나 설정 과정이 필요 없다. AGENTS.md가 '어떻게 만들지'를 정의한다면, DESIGN.md는 '어떻게 보여야 하는지'를 지시한다.
Apple, Stripe, Linear 등 글로벌 기업부터 1990년대 레트로 웹 디자인까지 다양한 스타일의 분석 자료가 포함되어 있다. 각 항목은 단순한 색상 코드가 아닌, 실제 디자인 의도와 패턴을 심층적으로 분석한 내용을 담고 있어 표면적인 모방을 넘어선 고품질 UI 생성을 돕는다.
Vibe Coding으로 빠르게 프로토타입을 만들 때 디자인 일관성을 유지하기 어려운 개발자나, 특정 브랜드의 디자인 언어를 AI에게 학습시키고 싶은 디자이너에게 유용하다. MIT 라이선스로 공개되어 있어 상업적 프로젝트에도 자유롭게 활용할 수 있다.
VoltAgent/awesome-design-md
A collection of DESIGN.md files analysis by popular brand design systems. Drop one into your project and let coding agents generate a matching UI.
이 한국어 소개글은 AI가 자동으로 만들었습니다. 원문의 주장과 맥락은 원문에서 확인해 주세요. 저작권은 원저작자에게 있습니다.