Repolode
Enviar
GLips

GLips/Figma-Context-MCP

Servidor MCP que dá a agentes de programação com IA, como o Cursor, acesso aos dados de layout e estilo de arquivos do Figma para implementar designs.

Ver no GitHubSite
Estrelas
16,040
Forks
1,266
Issues abertas
28
Último commit
há 6 dias

O que é?

O Framelink MCP for Figma é um servidor Model Context Protocol que conecta ferramentas de programação com IA, como o Cursor, à API do Figma. O usuário cola no chat um link para um arquivo, frame ou grupo do Figma, e o agente busca os metadados de layout e estilo relevantes para gerar o código correspondente.

Antes de enviar as respostas da API do Figma ao modelo, o servidor as simplifica e traduz para transmitir apenas as informações de layout e estilo mais relevantes. O objetivo declarado do projeto é reduzir o contexto fornecido ao modelo, o que torna o código gerado mais preciso do que em abordagens que dependem de screenshots colados.

A configuração exige um token de acesso pessoal do Figma e uma entrada de configuração do cliente MCP que execute o pacote figma-developer-mcp via npx, usando transporte stdio ou baseado em porta.

Recursos principais

  • 01Busca metadados de layout e estilo de um arquivo, frame ou grupo do Figma a partir de um link colado.
  • 02Simplifica as respostas da API do Figma para que o modelo receba apenas as informações de design mais relevantes.
  • 03Funciona como um servidor MCP iniciado com npx e configurado por meio de um arquivo JSON.
  • 04Aceita o token de acesso do Figma por uma flag de linha de comando ou pela variável de ambiente FIGMA_API_KEY.

Casos de uso

  • Implementar um design do Figma como código frontend no Cursor, usando o contexto de layout em vez de screenshots.
  • Permitir que um agente de IA leia a estrutura dos componentes e o espaçamento ao criar interfaces em qualquer framework.
  • Prototipar telas rapidamente, fornecendo frames existentes do Figma a um fluxo de trabalho com agentes.

Início rápido

  1. 1

    Crie um token de acesso do Figma seguindo as instruções indicadas no README

  2. 2

    Adicione a configuração do servidor MCP ao arquivo de configuração MCP do seu editor (macOS/Linux) usando sua chave de API

    npx -y figma-developer-mcp --figma-api-key=YOUR-KEY --stdio
  3. 3

    Reinicie seu cliente de IA e cole no chat o link de um arquivo, quadro ou grupo do Figma

Antes de usar

  • É necessário ter um token de acesso do Figma para que o servidor possa buscar dados de design.
  • Foi desenvolvido especificamente para o Cursor, então outros clientes de IA podem exigir configuração adicional.

Tópicos

#figma#mcp#ai-agent#cursor#frontend#design-to-code#typescript#ai

Perguntas frequentes

O que é Figma-Context-MCP?
Servidor MCP que dá a agentes de programação com IA, como o Cursor, acesso aos dados de layout e estilo de arquivos do Figma para implementar designs. O Framelink MCP for Figma é um servidor Model Context Protocol que conecta ferramentas de programação com IA, como o Cursor, à API do Figma. O usuário cola no chat um link para um arquivo, frame ou grupo do Figma, e o agente busca os metadados de layout e estilo relevantes para gerar o código correspondente.
Figma-Context-MCP é gratuito? Qual é a licença?
Figma-Context-MCP é open source sob a licença MIT. Confira os termos da licença antes de usá-lo em produtos comerciais.
Figma-Context-MCP ainda é mantido?
Manutenção ativa. O último commit de Figma-Context-MCP foi em 16 de out. de 2026.
Para que posso usar Figma-Context-MCP?
Implementar um design do Figma como código frontend no Cursor, usando o contexto de layout em vez de screenshots. Permitir que um agente de IA leia a estrutura dos componentes e o espaçamento ao criar interfaces em qualquer framework. Prototipar telas rapidamente, fornecendo frames existentes do Figma a um fluxo de trabalho com agentes.
Como instalar Figma-Context-MCP?
Crie um token de acesso do Figma seguindo as instruções indicadas no README Adicione a configuração do servidor MCP ao arquivo de configuração MCP do seu editor (macOS/Linux) usando sua chave de API: npx -y figma-developer-mcp --figma-api-key=YOUR-KEY --stdio Reinicie seu cliente de IA e cole no chat o link de um arquivo, quadro ou grupo do Figma
Onde consigo Figma-Context-MCP?
O código-fonte e as instruções de instalação estão no GitHub: https://github.com/GLips/Figma-Context-MCP

Resumo gerado por IA a partir do README do projeto. As estatísticas do GitHub são atualizadas diariamente.

Projetos relacionados