피그마 MCP 사용법

1. 피그마에서 자신의 토큰키 가져오기
2. 설치

# Figma 개발자 
MCP 설치 npx figma-developer-mcp --figma-api-key=토큰키

 

 

3. Curosr→ 환경설정 →MCP - +Add new MCP server 설정 파일 준비

 

• Windows용

{
  "mcpServers": {
    "figma-developer-mcp": {
      "command": "cmd",
      "args": [
        "/c",
        "npx",
        "-y",
        "figma-developer-mcp",
        "--stdio",
        "--figma-api-key=토큰키"
      ]
    }
  }
}

 

- Mac용 

{
  "mcpServers": {
    "figma-developer-mcp": {
      "command": "npx",
      "args": ["-y", "figma-developer-mcp", "--stdio"],
      "env": {
        "FIGMA_API_KEY": "토큰키"
      }
    }
  }
}

 

 

 

4. Figma 링크로 코드 생성 요청하기:

• Agent에게 다음 형식으로 요청:

@[Figma URL] 이대로 페이지 만들어줘

• 예시:

@<https://www.figma.com/design/WRN68GIlng8e7JDVzAVyio/iteamoa_copy?node-id=1-7647&t=4WxkVAB7fr7FhCwQ-4>

 

 

https://apidog.com/kr/blog/figma-mcp/