Webflow MCP 2.0 amplia controle de agentes sobre o design

Fim do bridge app

A versão anterior do MCP exigia manter uma aba do navegador aberta com um bridge app para que o agente acessasse o site. No MCP 2.0, essa exigência foi eliminada para a maioria das ações. O bridge app só é necessário quando o agente precisa acessar o canvas atual ou executar tarefas como "atualize a página em que estou".

Acesso completo a design tokens

O MCP 2.0 dá ao agente acesso total às variáveis CSS do site: leitura de coleções, criação e reordenação de variáveis, e adição de novos modos. O autor demonstra um caso em que pediu ao agente do Cursor para propor paletas de cores mais suaves para um site. O agente leu as variáveis, gerou um protótipo de pré-visualização e, após a escolha, atualizou mais de 50 design tokens de uma vez, criando ainda um novo modo de variável para alternar entre paletas.

Criação de componentes a partir de screenshots

O agente agora pode criar componentes Webflow com props, variantes e slots a partir de elementos e estilos existentes no site. O autor alimentou o Cursor com um screenshot de um esboço de componente e pediu que o transformasse em um componente configurável. O agente analisou a imagem, inspecionou a estrutura do site, construiu o componente e até tirou screenshots do progresso para verificar alinhamento com o original.

Rules e Skills: contexto persistente para o agente

O site Webflow ganhou uma seção "Instructions" na sidebar, dividida em:

• Rules - guardrails sempre ativos, aplicados a toda interação (ex.: "use nossos design tokens", "nunca hardcode cores").
• Skills - playbooks sob demanda, carregados apenas quando a tarefa exige (ex.: um skill "create-component" que define estrutura, props, variáveis e convenções de nomenclatura).

É possível referenciar primitivos nativos do Webflow (variáveis, componentes, estilos) diretamente nas instruções, garantindo que o agente trabalhe com dados reais e não informações desatualizadas.

Outras capacidades

• Ler formulários, listar submissões, atualizar ou deletar.
• Trabalhar com page branches e aplicar roles e permissões.
• Gerenciar assets e pastas, comprimir imagens para WebP ou AVIF.
• Ler e escrever código de head e footer (nível de página e de site).
• Acessar histórico do site (planos Enterprise) para rastrear quem mudou o quê, incluindo alterações feitas por agentes.
• Consultar analytics em linguagem natural: top páginas, canais, fontes, engajamento e tempo no site.