figma-mcp-go

Figma MCP — 무료, 속도 제한 없음

플러그인을 통해 전체 읽기/쓰기 권한을 제공하는 오픈 소스 Figma MCP 서버입니다. REST API를 사용하지 않으므로 속도 제한이 없습니다. 텍스트를 디자인으로, 디자인을 실제 코드로 변환하세요. Cursor, Claude, GitHub Copilot 및 모든 MCP 호환 AI 도구와 함께 작동합니다.

주요 특징

Figma API 토큰 불필요
속도 제한 없음 — 무료 플랜 사용자에게 적합
플러그인 브리지를 통한 실시간 Figma 데이터 읽기 및 쓰기 — 총 58개 도구 제공
완전한 디자인 자동화 — 스타일, 변수, 컴포넌트, 프로토타입 및 콘텐츠
디자인 전략 포함 — read_design_strategy, design_strategy 등 다양한 프롬프트 내장

https://github.com/user-attachments/assets/17bda971-0e83-4f18-8758-8ac2b8dcba62

이 프로젝트가 존재하는 이유

대부분의 Figma MCP 서버는 Figma REST API에 의존합니다.

그것은 괜찮아 보이지만… 다음 제한에 도달하면 문제가 됩니다:

플랜	제한
Starter / View / Collab	월 6회 도구 호출
Pro / Org (Dev seat)	일 200회 도구 호출
Enterprise	일 600회 도구 호출

AI 도구를 실험 중이라면 몇 분 만에 이 제한을 모두 소진하게 될 것입니다.

저는 더 높은 제한을 지불할 여유가 없었습니다. 그래서 API를 전혀 사용하지 않는 무언가를 만들었습니다.

설치 및 설정

npx를 통해 설치하세요 — 빌드 단계가 필요 없습니다. 설정 영상을 시청하거나 아래 단계를 따르세요.

영상 보기

1. AI 도구 구성

Claude Code CLI

claude mcp add -s project figma-mcp-go -- npx -y @vkhanhqui/figma-mcp-go@latest

.mcp.json (Claude 및 기타 MCP 호환 도구)

{
  "mcpServers": {
    "figma-mcp-go": {
      "command": "npx",
      "args": ["-y", "@vkhanhqui/figma-mcp-go"]
    }
  }
}

.vscode/mcp.json (Cursor / VS Code / GitHub Copilot)

{
  "servers": {
    "figma-mcp-go": {
      "type": "stdio",
      "command": "npx",
      "args": [
        "-y",
        "@vkhanhqui/figma-mcp-go"
      ]
    }
  }
}

2. Figma 플러그인 설치

Figma 데스크톱에서: Plugins → Development → Import plugin from manifest 선택
plugin.zip에서 manifest.json 선택
Figma 파일 내에서 플러그인 실행

사용 가능한 도구

쓰기 — 생성

도구	설명
`create_frame`	자동 레이아웃, 채우기 및 부모가 포함된 프레임 생성
`create_rectangle`	채우기 및 모서리 반경이 포함된 사각형 생성
`create_ellipse`	타원 또는 원 생성
`create_text`	텍스트 노드 생성 (폰트 자동 로드)
`import_image`	base64 이미지를 디코딩하여 사각형 채우기로 배치
`create_component`	기존 FRAME 노드를 재사용 가능한 컴포넌트로 변환

쓰기 — 수정

도구	설명
`set_text`	기존 TEXT 노드의 텍스트 내용 업데이트
`set_fills`	노드에 단색 채우기(hex) 설정
`set_strokes`	노드에 단색 선 색상 및 두께 설정
`set_opacity`	하나 이상의 노드 투명도 설정 (0 = 투명, 1 = 불투명)
`set_corner_radius`	모서리 반경 설정 — 균일 또는 모서리별 설정
`set_auto_layout`	프레임의 자동 레이아웃(flex) 속성 설정 또는 업데이트
`move_nodes`	노드를 절대 x/y 위치로 이동
`resize_nodes`	너비 및/또는 높이로 노드 크기 조정
`rename_node`	노드 이름 변경
`clone_node`	노드 복제 (선택적으로 위치 재조정 또는 부모 재지정)

쓰기 — 삭제

도구	설명
`delete_nodes`	하나 이상의 노드를 영구 삭제

쓰기 — 프로토타입

도구	설명
`set_reactions`	노드에 프로토타입 반응(트리거 + 액션) 설정; `replace` 또는 `append` 모드
`remove_reactions`	노드에서 0부터 시작하는 인덱스로 전체 또는 특정 반응 제거

쓰기 — 스타일

도구	설명
`create_paint_style`	단색으로 명명된 페인트 스타일 생성
`create_text_style`	폰트, 크기, 간격으로 명명된 텍스트 스타일 생성
`create_effect_style`	명명된 효과 스타일 생성 (드롭 섀도우, 내부 섀도우, 블러)
`create_grid_style`	명명된 레이아웃 그리드 스타일 생성 (열, 행 또는 그리드)
`update_paint_style`	기존 페인트 스타일 이름 변경 또는 색상 변경
`apply_style_to_node`	기존 로컬 스타일을 노드에 적용하여 해당 스타일과 연결
`delete_style`	ID로 스타일(페인트, 텍스트, 효과 또는 그리드) 삭제

쓰기 — 변수

도구	설명
`create_variable_collection`	초기 모드를 선택적으로 포함하는 새 로컬 변수 컬렉션 생성
`add_variable_mode`	기존 컬렉션에 새 모드 추가 (예: Light/Dark)
`create_variable`	컬렉션 내에 변수 생성 (COLOR/FLOAT/STRING/BOOLEAN)
`set_variable_value`	특정 모드에 대한 변수 값 설정
`bind_variable_to_node`	로컬 변수를 노드 속성에 바인딩
`delete_variable`	변수 또는 전체 컬렉션 삭제

쓰기 — 컴포넌트 및 탐색

도구	설명
`navigate_to_page`	ID 또는 이름으로 활성 Figma 페이지 전환
`group_nodes`	두 개 이상의 노드를 GROUP으로 그룹화
`ungroup_nodes`	GROUP 노드 그룹 해제, 자식 노드를 부모로 이동
`swap_component`	INSTANCE 노드의 메인 컴포넌트 교체
`detach_instance`	컴포넌트 인스턴스를 분리하여 일반 프레임으로 변환

읽기 — 문서 및 선택

도구	설명
`get_document`	전체 현재 페이지 트리
`get_metadata`	파일 이름, 페이지, 현재 페이지
`get_pages`	모든 페이지 (ID + 이름) — 가벼운 로딩, 트리 로딩 없음
`get_selection`	현재 선택된 노드
`get_node`	ID로 단일 노드 가져오기
`get_nodes_info`	ID로 여러 노드 정보 가져오기
`get_design_context`	`detail` 수준(`minimal`/`compact`/`full`)이 포함된 깊이 제한 트리
`search_nodes`	하위 트리 내에서 이름 부분 문자열 및/또는 유형으로 노드 찾기
`scan_text_nodes`	하위 트리의 모든 텍스트 노드
`scan_nodes_by_types`	주어진 유형 목록과 일치하는 노드
`get_viewport`	현재 뷰포트 중심, 줌 및 가시 범위

읽기 — 스타일 및 변수

도구	설명
`get_styles`	페인트, 텍스트, 효과 및 그리드 스타일
`get_variable_defs`	변수 컬렉션 및 값
`get_local_components`	변형 속성이 있는 모든 컴포넌트 + 컴포넌트 세트
`get_annotations`	개발 모드 주석
`get_fonts`	현재 페이지에서 사용된 모든 폰트 (빈도순 정렬)
`get_reactions`	노드의 프로토타입/상호작용 반응

내보내기

도구	설명
`get_screenshot`	모든 노드의 Base64 이미지 내보내기
`save_screenshots`	디스크에 이미지 저장 (서버 측, API 호출 없음)
`export_frames_to_pdf`	여러 프레임을 디스크에 저장되는 단일 다중 페이지 PDF로 내보내기
`export_tokens`	디자인 토큰(변수 + 페인트 스타일)을 JSON 또는 CSS로 내보내기

MCP 프롬프트

프롬프트	설명
`read_design_strategy`	Figma 디자인 읽기를 위한 모범 사례
`design_strategy`	디자인 생성 및 수정을 위한 모범 사례
`text_replacement_strategy`	디자인 전체에서 텍스트를 교체하기 위한 청크 방식
`annotation_conversion_strategy`	수동 주석을 네이티브 Figma 주석으로 변환
`swap_overrides_instances`	컴포넌트 인스턴스 간 오버라이드 전송
`reaction_to_connector_strategy`	프로토타입 반응을 상호작용 흐름 다이어그램으로 매핑

기여

이슈와 PR은 언제나 환영합니다.

figma-mcp-go

figma-mcp-go

이 프로젝트가 존재하는 이유

설치 및 설정

1. AI 도구 구성

2. Figma 플러그인 설치

사용 가능한 도구

쓰기 — 생성

쓰기 — 수정

쓰기 — 삭제

쓰기 — 프로토타입

쓰기 — 스타일

쓰기 — 변수

쓰기 — 컴포넌트 및 탐색

읽기 — 문서 및 선택

읽기 — 스타일 및 변수

내보내기

MCP 프롬프트

관련 프로젝트

기여

Star History

Resources

Tools

Latest Blog Posts

MCP directory API