arinspunk/claude-talk-to-figma-mcp

개요 claude-talk-to-figma-mcp는 Model Context Protocol(MCP)을 활용하여 Claude Desktop, Claude Code, Cursor 등 AI 도구에서 Figma 디자인을 직접 읽고, 분석하고, 수정할 수 있게 해주는 오픈소스 프로젝트다. TypeScript로 작성되었으며, GitHub 스타 528개를 기록하며 빠르게 주목받고 있다.

핵심 내용 디자이너와 개발자 사이의 핸드오프 과정은 오랫동안 비효율의 원인이었다. 이 프로젝트는 MCP라는 표준 프로토콜을 통해 AI가 Figma 파일의 구조를 이해하고, 컴포넌트를 조회하며, 레이아웃이나 스타일을 직접 변경할 수 있도록 한다. 대화형 인터페이스로 "이 버튼의 패딩을 16px로 변경해줘"와 같은 자연어 명령이 가능해진다.

기존 대비 차별점 기존 Figma 플러그인들은 Figma 내부에서만 동작하지만, 이 MCP 서버는 AI 에이전트 쪽에서 Figma를 제어한다는 점이 근본적으로 다르다. Claude Code에서 코드를 작성하면서 동시에 디자인 파일을 참조하거나 수정할 수 있어, 개발과 디자인 작업을 하나의 AI 워크플로우로 통합할 수 있다.

활용 가능성 - 디자인 시스템 감사: AI가 Figma 컴포넌트를 순회하며 일관성 검사를 자동 수행 - 코드-디자인 동기화: 코드 변경 시 Figma 디자인도 함께 업데이트하는 워크플로우 구축 - 프로토타이핑 가속: 자연어로 UI 레이아웃을 빠르게 생성하고 반복 - 접근성 검토: 색상 대비, 폰트 크기 등을 AI가 자동으로 점검

참고 자료 - 원본 저장소 ===