Claude Code에서 Figma "Code to Canvas"가 안 되는 이유 — 삽질 끝에 찾은 답

Philipy (윤상필)·2026년 3월 24일

이 글은 Claude Code(Anthropic CLI)의 도움을 받아 작성되었습니다. 실제 프로젝트 작업 중 겪은 문제 해결 과정을 Claude Code가 정리한 것입니다.

AI로 디자인 시안을 자동 생성하고 싶었다. 웹 페이지를 캡처해서 Figma에 편집 가능한 프레임으로 넣어주는 기능 — Figma에서는 이걸 Code to Canvas라고 부르고, 도구 이름은 generate_figma_design이다.

공식 문서에 버젓이 있고, 2026년 2월에 정식 출시됐고, Pro 플랜이면 쓸 수 있다고 되어 있다.

그런데 도구 목록에 안 나온다.

읽기 도구(get_design_context, get_screenshot)는 잘 된다. 쓰기 도구 중 add_code_connect_map도 보인다. 유독 generate_figma_design만 없다.

여기서부터 삽질이 시작됐다.


"시트를 바꿔야 하는 거 아닌가?"

처음 의심한 건 Figma 플랜이었다. Figma MCP에 인증된 계정이 Dev 시트였기 때문이다.

Figma 시트에는 View, Dev, Full이 있고, 기능에 따라 접근 범위가 다르다. generate_figma_design은 쓰기 도구니까 Full 시트가 필요한 게 아닐까?

계정을 확인해봤다.

lee***@gmail.com — Pro 플랜, Dev 시트

Dev를 Full로 바꿔야 하나. Full 시트는 월 $15~20 추가다. 진짜 그게 원인인지도 모르는데 돈부터 쓰기는 좀 그렇다.

다행히 다른 계정이 있었다. Full 시트를 가진 다른 계정으로 바꿔봤다.

philip***@gmail.com — Pro 플랜, Full 시트

여전히 안 된다.

시트가 원인이 아니었다.


"계정을 바꿔야 하는 거 아닌가?"

그럼 계정 자체가 문제인가. 혹시 Enterprise 플랜에서만 되는 건 아닌가.

Claude Desktop 설정에서 Figma 커넥터를 제거하고 다른 계정으로 다시 연결했다. 총 3번.

lee*** (Pro/Dev) → 안 됨
o*** (Starter/View) → 안 됨 (월 6회 제한이라 사실상 못 씀)
philip*** (Pro/Full) → 안 됨

3번 다 안 됐다. 계정을 바꿀 때마다 OAuth 인증을 다시 하고, 브라우저에서 Google 계정 선택하고, Figma 승인하고... 번거롭기만 했다.

중간에 Claude 구독 계정(o*)이랑 Figma 계정이 달라서 혼란스러웠다. "Claude Max 구독은 A 메일인데, 왜 Figma MCP는 B 메일로 되어 있지?" 결론부터 말하면 둘은 완전히 별개다.** Claude 구독 계정은 Claude 서비스 로그인용이고, Figma MCP 인증은 "Claude가 Figma API를 호출할 때 누구 권한으로 할 건지"를 정하는 것뿐이다.


"다른 사람한테 영향 가는 거 아닌가?"

계정을 바꾸거나 커넥터를 제거할 때마다 걱정이 됐다. 팀원들도 이 Figma 파일을 쓰고 있는데, 내가 설정을 건드리면 다른 사람도 못 쓰게 되는 거 아닌가?

아니다. MCP 인증은 내 컴퓨터의 Claude에서만 적용된다. Figma 파일의 권한이나 소유권이 바뀌는 게 아니다. 다른 팀원의 환경에는 아무 영향이 없다.

이걸 알고 나니 마음이 편해졌다. 설정을 자유롭게 바꿔볼 수 있게 됐다.


진짜 원인을 찾다

여기까지 하고 멘탈이 좀 나갔다. Pro 플랜이고, Full 시트고, 공식 문서에는 있다고 하고, 그런데 안 보인다.

Claude (claude.ai 웹)에 상황을 정리해서 물어봤다.

현재 상황:
- Figma MCP 연결됨, 읽기 도구 정상
- Pro 플랜, Full 시트
- generate_figma_design만 도구 목록에 안 나옴
- 쓰기 도구에는 add_code_connect_map만 보임

질문:
1. 이 도구는 어떤 조건에서 활성화되는가?
2. 베타 옵트인이 필요한가?
3. Organization/Enterprise 전용인가?

돌아온 답변이 정확했다. 문제는 연결 방식이었다.


Claude Desktop 커넥터가 범인이었다

generate_figma_design원격 MCP 서버 전용 도구다.

Figma MCP 서버에 연결하는 방법은 두 가지가 있다:

  1. Claude Desktop 커넥터 (GUI) — 설정 → 커넥터 → Figma 연결
  2. CLI 직접 연결claude mcp add --transport http figma-remote-mcp https://mcp.figma.com/mcp

같은 서버(https://mcp.figma.com/mcp)에 같은 계정으로 연결하더라도, 1번 방식으로 연결하면 generate_figma_design이 숨겨진다. 이건 알려진 버그다. Figma 포럼(2026년 2월 23일)에 수십 명이 같은 문제를 보고했고, Figma 엔지니어링팀도 인지하고 있다.

포럼에서 해결한 사용자의 말:

"I had to also disconnect the Claude desktop plugin for Figma. The only thing that can be connected is the MCP server in Claude CLI."


해결

  1. Claude Desktop → 설정 → 커넥터 → Figma 제거
  2. 터미널에서:
    claude mcp add --transport http figma-remote-mcp https://mcp.figma.com/mcp
  3. Claude Code 완전 재시작
  4. Claude Code에서 /mcpfigma-remote-mcp 선택 → Figma 계정으로 OAuth 인증
  5. 도구 목록 확인
mcp__figma-remote-mcp__generate_figma_design ← 드디어 보인다

3시간 걸렸다.


알게 된 것들

1. 같은 서버, 다른 결과

같은 https://mcp.figma.com/mcp에 같은 계정으로 연결해도 방법에 따라 노출되는 도구가 다르다. GUI 커넥터는 내부적으로 뭔가 다르게 처리하는 모양이다. 이건 Figma 쪽 버그이고, 언젠가 고쳐지겠지만 지금은 CLI로 연결해야 한다.

2. Claude 구독 계정 ≠ Figma MCP 계정

이 두 개는 완전히 독립적이다. Claude Max를 A@gmail.com으로 구독하면서 Figma MCP는 B@gmail.com으로 인증할 수 있다. MCP 인증은 "내 컴퓨터의 Claude가 누구 권한으로 Figma API를 호출하는가"를 정하는 것뿐이다.

3. MCP 설정은 로컬 전용

커넥터를 제거하든, 계정을 바꾸든 다른 팀원에게 영향은 전혀 없다. 마음 편하게 실험해도 된다.

4. 시트/플랜을 먼저 의심하지 말 것

Pro + Full이면 충분하다. 도구가 안 보인다고 Enterprise로 업그레이드하거나 시트를 바꾸는 건 돈 낭비일 수 있다. 연결 방식부터 확인하자.

5. generate_figma_design의 실제 동작

이 도구는 실행 중인 웹 페이지를 브라우저에서 캡처해서 Figma 프레임으로 변환한다. 주의할 점:

  • Figma Desktop 앱이 실행 중이어야 한다 (캡처 스크립트를 주입하는 방식)
  • 캡처할 때 브라우저에서 "Entire screen" 버튼을 직접 클릭해야 한다
  • 출력물은 편집 가능한 텍스트와 auto-layout이 있지만, 디자인 시스템 컴포넌트로 인스턴스화되지는 않는다 (raw geometry)
  • 여러 화면을 캡처하려면 화면마다 개별 캡처해야 한다

완벽하진 않지만, 코드로 만든 UI를 Figma에 빠르게 넣을 수 있다는 것만으로도 충분히 가치 있다.


빠른 참조: 안 될 때 체크리스트

[ ] Claude Desktop에서 Figma 커넥터 GUI로 연결했나?
    → 제거하고 CLI로 전환

[ ] CLI로 연결했나?
    → claude mcp add --transport http figma-remote-mcp https://mcp.figma.com/mcp

[ ] Claude Code를 재시작했나?
    → 완전 종료 후 재실행

[ ] /mcp에서 figma-remote-mcp를 인증했나?
    → Figma 계정으로 OAuth

[ ] Figma Desktop 앱이 실행 중인가?
    → 캡처 시 필요

[ ] 도구 목록에서 generate_figma_design이 보이는가?
    → 안 보이면 위 단계 처음부터 다시

이 글은 실제 프로젝트에서 겪은 삽질을 기록한 것입니다. Figma MCP는 아직 초기 단계라 이런 문제가 있을 수 있고, 시간이 지나면 GUI 커넥터에서도 정상 작동할 수 있습니다. 그때까지는 CLI 연결을 추천합니다.


Written with Claude Code (Anthropic CLI) — 2026.03.24

profile
Tech Phase-smith, Karax wannabe

0개의 댓글