Skip to main content
Glama

ui-polish-mcp

用于AI代理创建UI的MCP服务器,使UI看起来不像AI生成的

检测并修复最常见的AI生成UI特征:通用调色板、均匀间距、无上下文的文案、过度动画和缺乏可访问性。


可用工具

Tool

功能

audit_component

分析JSX并返回0-100分 + 带修复方案的问题列表

refine_copy

将"Submit" / "Click here"转换为有上下文的文案

suggest_placeholder

生成真实的占位符,而不是"Enter your..."

suggest_theme

根据应用类型建议主题预设

get_theme

返回预设的完整令牌(颜色、字体、圆角、阴影)

list_presets

列出可用的5个预设

check_contrast

验证两个十六进制颜色之间的WCAG AA/AAA对比度

audit_color_pairs

一次审计多组颜色对


Related MCP server: v0-mcp-ts

主题预设

Preset

适用场景

studio

SaaS、生产力、开发工具(Linear/Vercel美学)

craft

博客、作品集、创意机构(手工编辑风格)

data

仪表盘、分析、DevOps(密集深色模式)

flow

CRM、引导流程、B2B应用(对话式SaaS)

brutal

颠覆性落地页、初创公司(新粗野主义)


安装

git clone https://github.com/Pedro21062014/ui-polish-mcp
cd ui-polish-mcp
npm install
npm run build

在Claude Desktop中配置

添加到claude_desktop_config.json

{
  "mcpServers": {
    "ui-polish": {
      "command": "node",
      "args": ["/caminho/absoluto/ui-polish-mcp/dist/index.js"]
    }
  }
}

macOS: ~/Library/Application Support/Claude/claude_desktop_config.json
Windows: %APPDATA%\Claude\claude_desktop_config.json


在Cursor中配置

在项目根目录创建.cursor/mcp.json

{
  "mcpServers": {
    "ui-polish": {
      "command": "node",
      "args": ["/caminho/absoluto/ui-polish-mcp/dist/index.js"]
    }
  }
}

代理使用(推荐流程)

1. suggest_theme(appType, industry, mood)
   → escolhe o preset certo

2. get_theme(preset)
   → pega os tokens e aplica no app

3. [agente cria os componentes]

4. audit_component(jsx)
   → verifica cada componente antes de entregar

5. refine_copy(text, { action, noun })
   → melhora todos os textos de botões/labels

6. audit_color_pairs(pairs)
   → valida acessibilidade da paleta inteira

输出示例 — audit_component

## Audit Result
Score: 52/100 | Grade: D
Summary: Fraco — múltiplos padrões de IA detectados. Revisão necessária.

### Issues (4)
1. [HIGH] color
- Problema: Paleta genérica: text-blue-500, bg-gray-100, text-gray-600
- Fix: Substitua por tokens customizados. Ex: text-[#1A1917], bg-[#FAFAF9]

2. [MEDIUM] spacing
- Problema: p-4 repetido 6x — espaçamento monótono sem hierarquia
- Fix: Varie: p-3 em elementos menores, p-6 em seções, p-10 em containers.

3. [HIGH] copy
- Problema: Copy genérico: "Submit", placeholder genérico
- Fix: Use verbos contextuais. Ex: "Salvar projeto", placeholder="Ex: pedro@empresa.com"

4. [HIGH] accessibility
- Problema: Botão com ícone sem aria-label
- Fix: <button aria-label="Fechar modal">

开发

npm run dev    # roda com tsx (sem build)
npm run build  # compila para dist/
Install Server
F
license - not found
A
quality
C
maintenance

Maintenance

Maintainers
Response time
Release cycle
Releases (12mo)
Commit activity

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

  • A
    license
    Not graded
    quality
    D
    maintenance
    MCP server that bridges design and code by generating UI components, layouts, and themes from text prompts using v0.dev, with features like code refactoring and accessibility auditing.
    17
    1
    MIT
  • F
    license
    A
    quality
    D
    maintenance
    MCP 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

View all related MCP servers

Related MCP Connectors

  • The Figma MCP server brings Figma design context directly into your AI workflow.

  • MCP server for AI agents to plan, verify, and deploy Cloudflare-native apps.

  • MCP server for Flux AI image generation

View all MCP Connectors

Latest Blog Posts

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/Pedro21062014/ui-polish-mcp'

If you have feedback or need assistance with the MCP directory API, please join our Discord server