오픈 소스. 새로운 가능성.

DesignMD는 모든 URL에서 색상, 타이포그래피, 간격, 브레이크포인트, 상호작용 상태 등 라이브 디자인 시스템을 추출하여 AI 코딩 에이전트에 최적화된 DESIGN.md 파일을 출력하는 CLI 도구입니다.

design-md-hub는 120개 브랜드의 디자인 시스템을 단일 평문 DESIGN.md 파일로 저장한 오픈소스 레포지토리입니다. AI 코딩 에이전트가 온브랜드 UI를 생성할 수 있도록 실제 사이트에서 역추적한 색상, 타이포그래피, 컴포넌트, 가드레일을 제공합니다.

Awesome DESIGN.md: Curated design system documents from real websites. Drop into your project, let AI agents generate UI matching brand identity.

brandmd는 웹사이트의 디자인 시스템을 추출하여 공식 @google/design.md 린터를 통과하는 DESIGN.md 파일을 생성하는 CLI 도구입니다. 이를 통해 Claude Code, Cursor 등 코딩 에이전트에게 UI 작성 전 브랜드 컨텍스트를 제공하며, 기본적으로 API 키 없이 로컬에서 실행됩니다.

Dembrandt는 Playwright로 사이트 렌더링 후 DOM 스타일을 읽어 색상, 타이포그래피, 간격, 보더, 그림자, 모션, 컴포넌트를 W3C 디자인 토큰으로 변환하는 Node.js CLI입니다. CI 드리프트 게이트와 MCP를 지원합니다.

oh-my-design은 AI 코딩 에이전트에 디자인 시스템을 설치하는 오픈소스 CLI 도구입니다. 한 번의 명령어로 440개 이상의 기업 디자인 레퍼런스, 28개 스킬, 20개 전문 역할을 Claude Code, Codex, Cursor, OpenCode 등 지원 에이전트에 추가합니다. 철학, 토큰, 컴포넌트 계약을 담은 휴대용 DESIGN.md를 생성합니다.