freema/mcp-design-system-extractor
🔌 MCP 서버freema
Storybook 디자인 시스템에서 컴포넌트 메타데이터, 스타일, 속성을 추출하여 AI가 분석할 수 있게 돕는 MCP 서버.
mcp-design-system-extractor는 디자인 시스템을 AI 기반 개발 워크플로우에 통합하려는 팀을 위한 강력한 유틸리티입니다. MCP를 활용하여 실시간 Storybook 인스턴스와 AI 에이전트 사이의 가교 역할을 수행합니다. 디자인 시스템 문서와 컴포넌트 메타데이터를 파싱하여 LLM이 해석할 수 있는 기계 가독형 형식으로 변환합니다. 주요 기능으로는 일관된 브랜드 UI 코드 생성에 필수적인 컴포넌트별 속성, CSS/스타일 정의, 테마 토큰 추출이 포함됩니다. 이 도구는 AI 활용을 위해 컴포넌트 API를 수동으로 문서화하는 번거로움을 없애주며, AI가 항상 최신 디자인 시스템 사양에 접근할 수 있도록 보장합니다. UI 컴포넌트 생성 자동화, 기존 디자인 패턴 준수, AI 보조 코드 생성을 통한 디자인 및 엔지니어링 팀 간의 원활한 협업에 특히 유용합니다.
💡하이라이트
- ├─컴포넌트 속성 및 테마 토큰 추출
- ├─Storybook 네이티브 통합 지원
- └─MCP 표준 데이터 전달 규격 준수
🎯대상
- ├─프론트엔드 개발자
- └─AI 엔지니어