Como instalar e usar o Figma Context MCP

Passo a passo

Antes de começar: Um token de acesso do Figma (Figma API access token); Node, porque a configuração usa npx; Um cliente MCP compatível.

1. Crie o token de acesso do Figma

   O README exige um token de acesso pessoal do Figma e aponta uma página de ajuda do Figma para criá-lo. Guarde o token com cuidado.

2. Abra a configuração do seu cliente MCP

   O README diz que vários editores e clientes usam um arquivo de configuração para listar servidores MCP. O README não traz um comando claude mcp add; ele mostra o bloco de configuração abaixo.

3. Cole o bloco de configuração (Mac e Linux)

   Troque YOUR-KEY pelo seu token do Figma e coloque o bloco no arquivo de configuração do cliente.

   ComandoCopiar ⧉

   {
     "mcpServers": {
       "Framelink MCP for Figma": {
         "command": "npx",
         "args": ["-y", "figma-developer-mcp", "--figma-api-key=YOUR-KEY", "--stdio"]
       }
     }
   }

4. No Windows, use a versão com cmd

   No Windows o README mostra o mesmo bloco, chamando o npx por meio do cmd.

   ComandoCopiar ⧉

   {
     "mcpServers": {
       "Framelink MCP for Figma": {
         "command": "cmd",
         "args": ["/c", "npx", "-y", "figma-developer-mcp", "--figma-api-key=YOUR-KEY", "--stdio"]
       }
     }
   }

5. Alternativa: chave por variável de ambiente

   Em vez de escrever a chave nos argumentos, o README diz que dá para definir FIGMA_API_KEY e PORT no campo env.

6. Use na conversa

   Abra o chat do agente, cole o link de um arquivo, quadro ou grupo do Figma e peça uma ação, como implementar o design.

Cuidados

• O token do Figma dá acesso aos seus arquivos. Não o coloque em arquivos que vão para um repositório público.
• O servidor simplifica a resposta da API do Figma e entrega só o que é mais relevante de layout e estilo ao modelo.
• O README usa o Cursor nos exemplos e fala em "outros" programas de código com IA. Ele não traz um passo específico para o Claude Code, então confira no README como o seu programa recebe a configuração.

Como desfazer

O README não traz passo de remoção. Com a configuração em arquivo, basta tirar o bloco do servidor e revogar o token no Figma.

O que o README não confirma

Esta página foi montada lendo o README. Estes pontos não estão escritos lá:

• O README não traz o comando claude mcp add nem confirma o uso no Claude Code. Confira a página de início rápido do Framelink.
• Custo e limites do Figma ou do Framelink não aparecem no README.
• O README não diz que partes do arquivo do Figma são enviadas ao modelo além de layout e estilo.

Dúvidas

Próximo da lista

← #10 MCP Toolbox · #12 Apify →

Ver os 15 MCPs