MCP UI Research
Allows searching the web via DuckDuckGo to gather visual references and patterns for UI research.
Provides persistent storage for project research, delivery records, and implementation reviews, enabling recall across sessions.
Click on "Install Server".
Wait a few minutes for the server to deploy. Once ready, it will show a "Started" state.
In the chat, type
@followed by the MCP server name and your instructions, e.g., "@MCP UI ResearchResearch premium car dealership niche and generate original HTML/CSS components."
That's it! The server will respond to your query, and you can continue using it as needed.
Here is a step-by-step guide with screenshots.
MCP UI Research
Servidor MCP via stdio, em Python/FastMCP, que ajuda agentes a pesquisar referências de um nicho, extrair padrões visuais, sintetizar componentes HTML/CSS originais e lembrar o que foi pesquisado e entregue.
Ele deliberadamente não clona código de terceiros. O servidor coleta sinais agregados — cores, tipografia declarada, estrutura semântica, labels e métricas CSS — e gera componentes novos. Isso reduz riscos autorais, de segurança e de qualidade associados a copiar páginas arbitrárias.
Ferramentas
research_niche: pesquisa referências, inspeciona páginas, recomenda decisões e devolve componentes.inspect_reference: analisa uma URL pública específica.remember_delivery: registra o que o agente implementou.recall_project: recupera pesquisa, entregas e revisões do SQLite.review_implementation: avalia HTML com verificações de semântica, responsividade e acessibilidade.
Related MCP server: browser-mcp
Instalação e execução
python -m venv .venv
. .venv/bin/activate
pip install -e '.[dev]'
mcp-ui-researchO protocolo MCP usa stdout; logs e mensagens de aplicação nunca devem ser impressos nele.
Configuração JSON em clientes MCP
Depois de instalar as dependências, clientes compatíveis com o formato mcpServers podem iniciar o servidor diretamente pelo executável criado no ambiente virtual:
{
"mcpServers": {
"ui-research": {
"command": "/caminho/absoluto/MCPUIResearch/.venv/bin/mcp-ui-research",
"args": [],
"env": {
"MCP_UI_DATA_DIR": "/caminho/absoluto/MCPUIResearch/.mcp-ui-research",
"MCP_UI_HTTP_TIMEOUT": "12"
}
}
}
}Também é possível executar o módulo Python explicitamente. Essa forma é útil quando o cliente exige command e args separados:
{
"mcpServers": {
"ui-research": {
"command": "/caminho/absoluto/MCPUIResearch/.venv/bin/python",
"args": ["-m", "mcp_ui_research.server"],
"env": {
"MCP_UI_DATA_DIR": "/caminho/absoluto/MCPUIResearch/.mcp-ui-research"
}
}
}
}Use sempre caminhos absolutos. No Windows, aponte command para .venv\\Scripts\\python.exe e utilize caminhos JSON escapados, como C:\\Projetos\\MCPUIResearch.
Configuração direta no LM Studio
No LM Studio, abra a aba Program na barra lateral direita e selecione Install > Edit mcp.json. O LM Studio utiliza o formato mcpServers compatível com servidores MCP locais via stdio.
Para este repositório, instalado no caminho atual, adicione ao mcp.json:
{
"mcpServers": {
"ui-research": {
"command": "/home/wanbnn/Projetos/MCPUIResearch/.venv/bin/python",
"args": ["-m", "mcp_ui_research.server"],
"env": {
"MCP_UI_DATA_DIR": "/home/wanbnn/Projetos/MCPUIResearch/.mcp-ui-research",
"MCP_UI_HTTP_TIMEOUT": "12"
}
}
}
}Salve o mcp.json, ative o servidor ui-research na tela de MCPs e selecione um modelo com suporte adequado a tool calling. Se o LM Studio já estava com uma conversa aberta, inicie uma nova conversa para garantir que a lista de ferramentas seja carregada.
Exemplo de solicitação no chat do LM Studio:
Crie uma landing page responsiva em HTML e CSS para uma loja de carros premium.
Antes de implementar, use ui-research para pesquisar o nicho com o project_id
"loja-carros-premium". Aplique os padrões relevantes, registre a entrega e revise
o HTML final usando as ferramentas do MCP.O fluxo esperado de chamadas é:
research_niche → implementação pelo agente → remember_delivery
→ review_implementation → correções finaisFluxo recomendado ao agente
Chame
research_niche(niche, project_id)antes de desenhar a página.Escolha apenas os padrões coerentes com público, marca e objetivo.
Adapte os componentes devolvidos; não trate o código como página completa.
Chame
remember_deliveryao implementar.Envie o HTML final para
review_implementation, corrija os pontos relevantes e registre novamente.
Limites e operação responsável
A busca padrão usa a página HTML do DuckDuckGo e pode sofrer rate limit ou mudança de markup.
O coletor limita tamanho, tempo e quantidade de conexões e bloqueia destinos locais/privados.
Sites muito dependentes de JavaScript podem expor poucos sinais sem um navegador headless.
Respeite termos de uso,
robots.txt, direitos autorais e marcas antes de uso comercial.Resultados da web são dados não confiáveis; o servidor não executa scripts encontrados.
Testes
pytest
ruff check .Maintenance
Resources
Unclaimed servers have limited discoverability.
Looking for Admin?
If you are the server author, to access and configure the admin panel.
Related MCP Servers
- Alicense-qualityAmaintenanceMCP server that enables AI coding agents to read and write to a local-first HTML/CSS design canvas, bridging visual design and code generation.MIT
- AlicenseAqualityDmaintenanceA powerful MCP server for UI designers and developers to extract, analyze, and clone website front-end code (HTML, CSS) with pixel-perfect accuracy using browser automation.11202MIT
- FlicenseAqualityDmaintenanceMCP server that gives AI coding agents the ability to design UIs through Google Stitch. It generates production-ready HTML and screenshots from natural language prompts.9
- FlicenseAquality-maintenanceMCP server enabling AI agents to search, retrieve details, and compare UI components from 13 popular UI libraries.3
Related MCP Connectors
A paid remote MCP for AI agent browser approval MCP, built to return verdicts, receipts, usage logs,
Screenshot, diff, audit and sitemap-capture any web page — 5 MCP tools for AI agents.
Paid remote MCP for agent code search routing MCP, structured receipts, audit logs, and reviewer-rea
Latest Blog Posts
- Who's Calling? MCP Hosts Are an Identity Blind Spot (And the Spec Knows It)By Om-Shree-0709 on .mcpAgent IdentityOAuth 2.1
- Your AI Chatbot Just Exposed Your CEO's Salary to an InternBy Om-Shree-0709 on .Agent IdentityMCP SecurityOAuth Delegation
- Why MCP Servers Need Execution Sandboxing (And Why Your Current Stack Isn't Enough)By Om-Shree-0709 on .Agentic AiPrompt InjectionWebAssembly
MCP directory API
We provide all the information about MCP servers via our MCP API.
curl -X GET 'https://glama.ai/api/mcp/v1/servers/wanbnn/MCPUIResearch'
If you have feedback or need assistance with the MCP directory API, please join our Discord server