MCP server Visual Intent Layer
Commit 20 de set. de 2026Permite que um agente de IA receba anotações visuais precisas ao apontar, arrastar ou selecionar alvos dentro de uma interface renderizada no navegador.
Também conhecido como willa-code/visual-intent-layer
- Stars
- 0
- Ferramentas
- —
- Downloads, 30 dias
- —
- Versão mais recente
- 0.4.0
- Último commit
- 20 de set. de 2026
- Licença
- Apache-2.0
O que é o MCP Visual Intent Layer?
Visual Intent Layer é um MCP server. Permite que um agente de IA receba anotações visuais precisas ao apontar, arrastar ou selecionar alvos dentro de uma interface renderizada no navegador.
Resumo gerado a partir do README do projeto
Sobre o MCP server de Visual Intent Layer
Fornecer contexto visual preciso para agentes de IA é o que este MCP server local permite para desenvolvedores que trabalham com aplicações web locais ou documentos HTML salvos. Em vez de depender de descrições em texto para explicar onde os elementos estão localizados, os usuários podem interagir com uma interface renderizada no navegador para apontar, arrastar ou selecionar alvos específicos. Isso cria um link direto entre a intenção visual humana e a ação do agente.
O servidor roda localmente na sua máquina e requer Node.js 20 ou superior, além de um navegador web. Ele funciona iniciando um navegador e vinculando uma porta loopback para exibir uma Review Surface. Como ele depende dessa exibição local, não pode ser usado a partir de um host remoto, um container ou um agente baseado em nuvem.
Os usuários gerenciam seu fluxo de trabalho por meio de uma Review Surface, onde podem agrupar alvos em anotações, anexar imagens de referência e acompanhar o estado de entrega de cada requisição. Essa configuração permite o julgamento humano, deixando você revisar manualmente e decidir sobre cada anotação para garantir que o agente siga suas instruções exatas.
O que você pode fazer com ele
- 1Especificar mudanças de UI visualmenteUm agente de IA pode receber instruções através de um usuário que aponta, arrasta ou seleciona alvos dentro de uma interface de navegador.
- 2Organizar feedback visual complexoVocê pode agrupar múltiplos alvos visuais em uma única anotação e incluir imagens de referência para maior clareza.
- 3Auditar ações do agente manualmenteUm desenvolvedor pode usar a Review Surface para inspecionar e decidir o status de cada anotação manualmente.
- 4Acompanhar o progresso das anotaçõesO sistema mantém um registro de anotações não enviadas e entregues, junto com seu estado de resolução.
Escrito a partir do README do projeto. Cada caso de uso é verificado com uma citação dele.
Como instalar o MCP Visual Intent Layer
Formatos verificados em 10 nov 2026Adicionar ao CursorAdicionar ao GooseInstalar o MCP Visual Intent Layer no Claude Code
$ claude mcp add visual-intent-layer -- npx -y visual-intent-layerInstalar o MCP Visual Intent Layer no Cursor
~/.cursor/mcp.json
{
"mcpServers": {
"visual-intent-layer": {
"command": "npx",
"args": [
"-y",
"visual-intent-layer"
]
}
}
}Instalar o MCP Visual Intent Layer no VS Code
.vscode/mcp.json
{
"servers": {
"visual-intent-layer": {
"type": "stdio",
"command": "npx",
"args": [
"-y",
"visual-intent-layer"
]
}
}
}Instalar o MCP Visual Intent Layer no VS Code CLI
$ code --add-mcp '{"name":"visual-intent-layer","type":"stdio","command":"npx","args":["-y","visual-intent-layer"]}'Instalar o MCP Visual Intent Layer no Claude Desktop
claude_desktop_config.json
{
"mcpServers": {
"visual-intent-layer": {
"command": "npx",
"args": [
"-y",
"visual-intent-layer"
]
}
}
}Instalar o MCP Visual Intent Layer no Codex
$ codex mcp add visual-intent-layer -- npx -y visual-intent-layerInstalar o MCP Visual Intent Layer no Codex config.toml
~/.codex/config.toml
[mcp_servers.visual-intent-layer] command = "npx" args = ["-y", "visual-intent-layer"]
Instalar o MCP Visual Intent Layer no Gemini CLI
$ gemini mcp add -s user visual-intent-layer npx -- -y visual-intent-layerInstalar o MCP Visual Intent Layer no Gemini settings.json
~/.gemini/settings.json
{
"mcpServers": {
"visual-intent-layer": {
"command": "npx",
"args": [
"-y",
"visual-intent-layer"
]
}
}
}Verificações automatizadas
Executado em 15 de nov. de 2026Relatório completo →Ainda não verificado. Um servidor precisa de uma pontuação de 80, nenhum problema grave e dados suficientes para verificarmos. Como as verificações funcionam · O que corrigir para ganhar mais pontos
- Repositório de origem vinculado e acessívelRepository not reachablegithub.com/willa-code/visual-intent-layer ↗Problema encontrado
- O pacote indica este repositório como sua origemvisual-intent-layer names willa-code/visual-intent-layer as sourcenpmjs.com/package/visual-intent-layer ↗Passou
- Proveniência da build (atestação Sigstore)Sigstore attestation for visual-intent-layernpmjs.com/package/visual-intent-layer/v/0.4.0#provenance ↗Passou
- Licença de código aberto (OSI)Apache-2.0spdx.org/licenses/Apache-2.0.html ↗Passou
- Commit ou release no último anoLast commit or release 2026-09-20github.com/willa-code/visual-intent-layer ↗Passou
- OpenSSF ScorecardNão verificado
- Nome do pacote não é próximo a um pacote popularNo popular package one edit away from visual-intent-layerPassou
- Nenhum aviso crítico no pacote ou em suas dependências100 resolved dependencies checked; no critical advisoryosv.dev ↗Passou
- Sem instruções ocultas para o modelo0 tool descriptions and the README read; no override phrases, credential paths or hidden charactersPassou
- Ferramentas destrutivas estão rotuladasNão verificado
- O endpoint remoto responde ao handshake do MCPNão verificado
README
Ver no GitHubVisual Intent Layer
Point at a browser-rendered interface, describe what should change, and let an agent work from that precise visual context. Visual Intent Layer is a local MCP server and Review Surface for saved HTML documents and local web apps.
About
hello world! this project is a testbed for me to experience new/random/trending stuff! fyi on what i was testing:
- pstack's verification skills
- matt's skills
- ds v4.1 flash via openrouter in pi
- ...
Key features
- Direct pointing. Point, drag, or box visible targets instead of describing their location in prose.
- Annotations with context. Group targets into one Annotation and attach reference images when useful.
- Delivery state you can read. Keep unsent and delivered Annotations together with their revision and resolution state.
- Human judgement. Review the result in a browser and decide each Annotation by hand.
- Local by default. Keep review data on the local machine.
Mobile builds, native windows, design files, and PDFs are outside the supported surface.
Requirements
- Node.js 20 or newer
- A browser on the machine running the server
- An MCP-capable agent, if you want an agent to use the Review Surface
No hosted account or Rust toolchain is required.
Quickstart
Register the local stdio server with your agent, then restart the agent:
{
"mcpServers": {
"visual-intent-layer": {
"command": "npx",
"args": ["-y", "--package", "visual-intent-layer@latest", "visual-intent-mcp"]
}
}
}
The server must run on the machine where you look at the screen. It launches a browser there and binds a loopback port. A server in a container, on a remote host, or inside a cloud agent cannot display that machine's Review Surface.
Registry-aware clients can also find the server as
io.github.willa-code/visual-intent-layer in the official MCP Registry, which
lists where to get it rather than hosting it.
claude mcp add visual-intent-layer -- npx -y --package visual-intent-layer@latest visual-intent-mcp
codex mcp add visual-intent-layer -- npx -y --package visual-intent-layer@latest visual-intent-mcp
Run opencode mcp add visual-intent-layer, then provide npx and the package
arguments when prompted:
-y --package visual-intent-layer@latest visual-intent-mcp
pi does not ship an MCP client. With pi-mcp-adapter installed, add this to
the project's .mcp.json (merge it into an existing mcpServers object):
{
"mcpServers": {
"visual-intent-layer": {
"command": "npx",
"args": ["-y", "--package", "visual-intent-layer@latest", "visual-intent-mcp"]
}
}
}
The same entry can be placed in .pi/mcp.json for a project-only Pi override,
or ~/.config/mcp/mcp.json for all projects. The adapter's /mcp setup panel
can also create the entry.
Use the JSON configuration above, or launch a local stdio server with command
npx and arguments -y --package visual-intent-layer@latest visual-intent-mcp.
Start a review without an agent
The package also provides a local CLI:
npx -y --package visual-intent-layer@latest visual-intent open --html ./checkout.html
npx -y --package visual-intent-layer@latest visual-intent open --app http://localhost:5173
Each command opens the default browser and prints the review URL. Add
--no-open for headless or scripted use. To run only the local service:
npx -y --package visual-intent-layer@latest visual-intent serve --port 3742
The visual-intent command is also available after
npm install -g visual-intent-layer.
Data and privacy
The server writes review data to ~/.visual-intent-layer/data by default. It
does not write agent configuration. Uninstalling the package does not delete
reviews; remove that data directory only when you want to remove them.
Set VISUAL_INTENT_DATA_DIR to choose another data directory. Set
VISUAL_INTENT_NO_OPEN=1 to suppress automatic browser opening.
Update and uninstall
@latest is resolved when npx fetches the package, so there is usually
nothing to update by hand. pi-mcp-adapter caches the resolved command for 24
hours; delete ~/.pi/agent/mcp-npx-cache.json to force a fresh fetch. Replace
@latest with an exact version in the entry to hold a version still, and update
a global install with npm install -g visual-intent-layer@latest.
To uninstall, remove the entry with the mechanism you added it with — claude mcp remove visual-intent-layer, codex mcp remove visual-intent-layer, or by
editing your client's configuration. docs/guide.md names the
file for each client. Uninstalling deletes none of your reviews: they stay in
the data directory until you remove it.
Documentation
docs/guide.md— product manual, Review Surface, Annotation model, MCP tools, data, schema, development, and layout.design.md— normative Review Surface design contract.docs/design-references.md— component references and verification notes.docs/reference-foundations.md— comparison of candidate reference foundations.SECURITY.md— threat model, supported versions, and disclosure process.docs/adr/— architectural decisions.docs/pi-validation.md— live Pi validation checklist.
License
Apache-2.0.
Perguntas sobre o MCP Visual Intent Layer
Como adiciono o MCP Visual Intent Layer ao Claude Code?
Execute claude mcp add visual-intent-layer -- npx -y visual-intent-layer no seu terminal. Adicione --scope user para torná-lo disponível em todos os projetos.
Como adiciono o MCP Visual Intent Layer ao Cursor?
Abra ~/.cursor/mcp.json e adicione o servidor em mcpServers, usando a configuração do Cursor mostrada na seção de instalação acima.
Quais superfícies são suportadas pelo Visual Intent Layer?
O servidor suporta documentos HTML salvos e web apps locais, mas builds mobile, janelas nativas, arquivos de design e PDFs não são suportados.
Posso rodar este servidor em um container ou em um host remoto?
Não, o servidor deve ser executado na máquina local onde você está visualizando a tela, pois ele inicia um navegador local e faz o bind de uma porta loopback.
Quais são os requisitos do sistema?
Você precisa do Node.js versão 20 ou superior, um navegador na máquina que executa o servidor e um agente compatível com MCP para usar a Review Surface.