mcpField
H
housestyle

housestyle

本地服务
github.com/myanptl开发工具06 天前更新
代码仓库

关于 housestyle

housestyle 是用于审查并改进 AI 构建界面 CSS 设计选择的 MCP 服务。它识别常见的视觉模式，并提供字体选择、对比度检查、色板生成和流体字号比例工具。

主要功能

  1. 01审查 CSS 中常见的通用设计模式
  2. 02按角色和风格推荐字体及组合
  3. 03检查 WCAG 与 APCA 对比度
  4. 04生成 11 阶 OKLCH 色彩渐变
  5. 05生成流体模块化字号比例

适用场景

  1. 01审查 AI 构建界面的样式表
  2. 02按用途和视觉风格选择字体
  3. 03评估深色主题的文本对比度
  4. 04创建颜色与排版设计令牌

MCP 相关

向 MCP 客户端提供 CSS 审查和设计工具，包括字体推荐、对比度检查、色板生成及字号比例构建。

配置

本地服务的配置在各客户端中通用，复制后粘贴到客户端的 MCP 配置文件即可。

mcp.json · 通用配置
{
  "mcpServers": {
    "myanptl-housestyle": {
      "command": "npx",
      "args": [
        "-y",
        "housestyle-mcp"
      ]
    }
  }
}
启动命令npx -y housestyle-mcp

本地服务需要在你的电脑上安装运行环境（如 Node.js 18+）。各客户端的配置文件位置不同，请参考客户端文档。

安装包
npmhousestyle-mcp1.0.2

工具

6

收录的工具列表 · 更新于 2 周前

参数类型必填说明
cssstring是样式表文本、设计令牌块或 Tailwind 配置。请粘贴实际内容，而不是摘要。

详细介绍

housestyle-mcp

识别看起来像 AI 生成的 CSS，并针对字体、颜色和对比度提出修复建议。

claude mcp add housestyle -- npx -y housestyle-mcp

MIT 许可证。

评论

支持 Markdown

第一次接触 MCP？

从协议是什么，到在客户端里装上第一个服务，这几条回答覆盖了大多数入门问题。

一个开放协议，规定了 AI 应用如何以统一方式连接外部工具与数据源。客户端负责与模型对话，MCP 服务负责提供工具、资源和提示模板，两者通过标准消息通信，同一个服务可以被不同客户端复用。