Install
npx -y @figwright/mcp@latest누구에게 맞나
AI 에이전트가 Figma를 「보기만」하는 것이 아니라 로컬 WebSocket 중계로 공식 플러그인에 붙어 디자인을 읽고 캔버스에도 쓰길 원한다면 이 무료 양방향 MCP가 맞다. 대상은 Claude Code, Cursor, Codex 및 모든 MCP 클라이언트다. 도구는 113개이며 읽기, 쓰기, grounding을 덮는다. 에이전트는 디자인대로 구현할 수도 있고 캔버스에서 쌓을 수도 있다. Figma 무료 요금제에서 돌아가며 공식 Dev Mode MCP처럼 유료 좌석이 필요 없다. 이 기기에서의 디자인 협업에 맞다. 데스크톱이 없거나 플러그인이 연결되지 않은 채 쓰기 도구를 호출하는 것에는 맞지 않고, 이름이 나오지 않은 113개를 알려진 API로 보는 것에도 맞지 않는다. 요약은 데이터가 이 기기에 남는다고 한다. 파일 읽기와 캔버스 쓰기는 여전히 로컬 프라이버시 경계이며 「로컬 읽기 없음」이 아니다.
3분 만에 첫 시도
먼저 MCP 클라이언트, Figma 데스크톱, Node.js 20.19+ 또는 22.12+를 확인한다. 공식은 Node 18/21과 22.0–22.11을 지원하지 않는다고 쓴다. 서버는 npx가 따로 끌어오며 그 버전은 프로젝트 빌드용 Node와 달라도 된다. 무료 요금제로 충분하지만 플러그인 가져오기는 데스크톱 앱이 필요하다. 클라이언트 주 설정은:
npx -y @figwright/mcp@latest
전역 설치는 필요 없다. 시작 후 저장소 설명대로 Figma 데스크톱에서 플러그인을 가져오고 로컬 WebSocket 중계가 연결되었는지 확인한다. 먼저 낮은 위험 읽기를 한다. 클라이언트 목록에서 읽기 전용 또는 grounding을 골라 현재 선택 또는 페이지 구조를 본다. 증거는 113개 도구를 지목하지 않았다. 없으면 목록으로 호출하고 레이어 API를 만들지 마라. 성공 신호는 디자인 구조가 반환되는 것이며 캔버스가 고쳐진 것이 아니다. 캔버스에 쓰기 전에 읽기 성공을 반드시 본다. 선택적 npx skills add awdr74100/figwright/skills은 주 경로가 아니며 스킬은 MCP가 이미 연결된 것을 요구한다. 저장소: https://github.com/awdr74100/figwright
사용 사례
사례 1: 디자인대로 구현한다. 플러그인 연결 후 읽기/grounding 도구로 프레임워크 인지 디자인 구조를 이해하고 이 기기에서 코드를 낸다. 제목은 디자인을 프레임워크 인지 코드로 바꿀 수 있다고 쓴다. 증거는 지원 프레임워크 이름을 쓰지 않았다. 없으면 클라이언트가 반환한 구조를 따르고 내보내기 형식을 만들지 마라.
사례 2: 결과를 캔버스에 다시 쓴다. 에이전트가 Figma에서 쌓거나 코드를 되돌리게 하려면 캔버스 쓰기 도구를 쓴다. 디자인 파일을 바꾸며 부작용이 있다. 먼저 현재 파일이 버릴 수 있는 사본이거나 분명히 고치려는 파일인지 확인한 뒤 실행한다. 증거는 양방향·비읽기 전용만 보장하며 실행 취소 단계는 없다. 실패 때는 Figma 이력을 기준으로 하고 undo 명령을 만들지 마라.
사용 한계
데스크톱이 없으면 플러그인을 가져올 수 없고 중계도 연결되지 않는다. Node 버전이 맞지 않으면 억지로 돌리지 마라. 113개 도구 이름은 공개되지 않았다. 스스로 만들지 마라. 쓰기는 캔버스를 바꾼다. 읽기 성공 전에 일괄 쓰지 마라. 공식 Dev Mode MCP의 유료 제한은 Figwright에 적용되지 않지만 Figwright도 Figma 공식 좌석 대체품이 아니다. 스킬 팩은 부가물이며 @figwright/mcp를 대신하지 못한다. 에이전트가 디자인 파일을 보지 못한다고 가정하지 마라. 첫 시도는 npx -y @figwright/mcp@latest만 쓰고, 성공 신호를 읽기 전용 구조 반환 한 번으로 둔다.