PaletteGet

io.github.yang7206由 GitHub 账号 yang7206 发布v1.3.0更新于 Oct 24, 2026

Curated app, web and mini program color palettes with WCAG contrast and CSS variables.

已验证Streamable HTTP可网页运行开发者工具媒体与设计

概览

AI 生成的概览

PaletteGet 为助手提供经过 WCAG 校验的 UI 配色库，可查角色色值、对比度，并生成可直接粘贴的 CSS 或各平台代码。

可以做什么
  • 浏览与获取配色：按平台或标签列出配色，取某套配色的完整角色色值、对比度结果与搭配建议，或用中英文关键词获得推荐。
  • 校验可读性：计算任意两色的 WCAG 对比度并给出正文与大字两套判定，或为指定背景色返回按对比度排序的文字色候选。
  • 导出代码：生成 CSS 自定义属性，以及 Android、iOS、Flutter、小程序、SCSS、Tailwind 片段。
  • 派生变体：把基准色扩展为 50 到 900 色阶，或把浅色配色推导为深色版本并附实测对比度。
适用场景
适合在构建或改版 App、网页、小程序界面时使用，避免模型凭空编造十六进制色值。需要无障碍配色、深色模式变体或可直接贴入代码的设计变量时尤其合适。
运行要求
使用托管端点无需安装，也不需要 API 密钥或注册。本地 stdio 方式可通过 npx 或源码运行，需要 Node.js，并从公开数据集取数，可用 PALETTEGET_API、PALETTEGET_API_ZH、PALETTEGET_CACHE_MS、PALETTEGET_PROXY 配置。
安装前请注意
工具均为只读查询与生成，不索取任何凭据。本地 stdio 服务器会从 PaletteGet 公开站点取数，且 PALETTEGET_API 可指向其他地址，请只改为你信任的来源。

安装

在 SourceWeft 中

  1. 打开 控制台中的 PaletteGet，将其添加到工作区。
  2. 为需要使用其工具的对话启用该服务。

Web executable，通过 Streamable HTTP。 远程服务在工作区中配置后即可从网页运行时运行。

交给智能体安装

把这段提示词粘贴到 Claude Code、Codex、Cursor 等智能体，或 SourceWeft 对话中。智能体会读取该服务器的安装指南，先向你展示发布者、端点和登录方式，经你同意后再把它添加到你的客户端。密钥不会写进任何命令。

阅读 https://sourceweft.com/mcp/io.github.yang7206%2Fpaletteget/install.md，并按其中说明把这个 MCP 服务器接入我的客户端。修改任何配置之前，先告诉我它的发布者、端点和登录方式，等我确认。不要把 API 密钥写进命令或我会提交的文件；问我密钥应从哪里获取。

查看智能体所依据的安装指南

其他 MCP 客户端

把它添加到你客户端的 mcpServers 配置中。

{
  "mcpServers": {
    "paletteget": {
      "type": "http",
      "url": "https://paletteget-mcp.y7206062.workers.dev/mcp"
    }
  }
}

README

paletteget-mcp

[site] [palettes] [license]

An MCP server for the PaletteGet color palette library: 100 palettes across App, Web and Mini App UIs, each organized into 10 design roles and checked against WCAG contrast requirements.

It exists so your AI coding tool stops inventing hex values. Instead of guessing, the model calls a tool and gets the real role colors, the measured contrast ratios, and the pairing advice that ships with the palette.

No API key, no sign-up.

Use the hosted endpoint (nothing to install)

https://paletteget-mcp.y7206062.workers.dev/mcp
json
{  "mcpServers": {    "paletteget": {      "type": "http",      "url": "https://paletteget-mcp.y7206062.workers.dev/mcp"    }  }}

ChatGPT: Settings → Connectors → Add custom connector → paste the URL.

The hosted server embeds the dataset at deploy time, so it never depends on the site being reachable and answers in a few milliseconds.

Or run it locally (stdio)

From npm, no clone

bash
npx -y paletteget-mcp
json
{  "mcpServers": {    "paletteget": {      "command": "npx",      "args": ["-y", "paletteget-mcp"]    }  }}

Behind a proxy, set PALETTEGET_PROXY=http://127.0.0.1:7897 in the server's env block.

From source

bash
git clone https://github.com/yang7206/paletteget-mcp.gitcd paletteget-mcpnpm install
json
{  "mcpServers": {    "paletteget": {      "command": "node",      "args": ["/absolute/path/to/paletteget-mcp/index.mjs"]    }  }}

The stdio server fetches live data from the public JSON endpoints and caches it for 10 minutes.

Tools

ToolWhat it does
list_palettesList palettes, optionally filtered by platform (app / web / miniapp) or tag
get_paletteFull data for one palette: role colors, contrast results, human-written pairing advice
suggest_paletteRecommend palettes from keywords in English or Chinese, and say what matched
get_css_variablesCSS custom properties for a palette, ready to paste
check_contrastWCAG contrast between any two colors, with both the body-text and large-text verdicts
suggest_text_colorReadable text colors for a given background: same-hue tints and shades plus black and white, ranked by contrast
darken_paletteDerive a dark-mode version of a light palette with published rules, and the measured contrast of every pair
get_platform_snippetPaste-ready code for one palette: Android colors.xml, iOS UIColor, Flutter Color, mini program wxss, CSS, SCSS or Tailwind
get_color_scaleExpand one base color into a 50 to 900 scale, with white and black contrast per step; JSON, CSS or Tailwind output

Example call and result:

suggest_palette { "query": "dark finance dashboard", "limit": 2 }
- Ink Blue Night / 墨蓝夜（app，分 94）  slug: mo-lan-ye　主色: #4c8df6  场景: Finance & analytics apps (dark mode)  命中: 标签:dark, 场景:finance

Environment variables (stdio server)

VariableDefaultPurpose
PALETTEGET_APIhttps://paletteget.com/api/index.jsonOverride the dataset URL
PALETTEGET_API_ZHderived (/zh/api/index.json)Override the Chinese dataset URL
PALETTEGET_CACHE_MS600000Cache lifetime in milliseconds
PALETTEGET_PROXYnoneRoute requests through a proxy, e.g. http://127.0.0.1:7897. Also honours HTTPS_PROXY.

Behind a firewall, Node's built-in fetch ignores the usual proxy variables, so set PALETTEGET_PROXY explicitly.

Test

bash
npm run smoke

The smoke test speaks the MCP stdio protocol directly and exercises every tool against a local fixture, so it runs offline. Point PALETTEGET_API at the live site to test against production.

Maintaining the hosted worker

The worker (worker.mjs) is a hand-written, stateless subset of MCP Streamable HTTP (initialize, tools/list, tools/call, ping) with no SDK dependency, which keeps it small and Workers-native.

bash
# 1. Regenerate the embedded dataset (run both locales)SITE_URL=https://paletteget.com SITE_LOCALE=zh node --import ./alias-loader.mjs build-data.mjsSITE_URL=https://paletteget.com SITE_LOCALE=en node --import ./alias-loader.mjs build-data.mjs
# 2. Local checknpx wrangler dev          # POST JSON-RPC to http://127.0.0.1:8787/mcp
# 3. Deploy (needs CLOUDFLARE_API_TOKEN with Workers Scripts:Edit)npx wrangler deploy

build-data.mjs reuses the site's own i18n modules through alias-hooks.mjs, so names, scenes and advice stay identical to the published site. data/ is generated at build time and never committed.

Data and license

Code is MIT (see LICENSE). Palette data comes from paletteget.com and may be reused freely in personal and commercial projects; a credit link is appreciated.

Machine-readable forms of the same data, if you would rather skip MCP entirely:

  • Full dataset: https://paletteget.com/api/index.json
  • One palette: https://paletteget.com/palette-list/{platform}/{slug}/index.json
  • CSS variables: https://paletteget.com/palette-list/{platform}/{slug}/index.css
  • Agent guide: https://paletteget.com/llms.txt

来源：README.md，提交 cf70d2b

工具

9

list_palettes

列出配色库中的配色，可按平台（app / web / miniapp）与标签过滤。返回名称、slug、主色、场景与标签。

输入参数taglimitplatform

get_palette

取某一套配色的完整数据：角色色值（主色 / 功能色 / 中性色）、对比度、人工搭配建议。

输入参数slug必填platform

suggest_palette

按自然语言关键词推荐配色（中英文均可），例如「护眼的深色记账 App」「清新博客」。会说明每个结果命中了什么。

输入参数limitquery必填platform

get_css_variables

取一套配色的 CSS 自定义属性（可直接粘进项目），含语义化变量名。

输入参数slug必填platform

check_contrast

算两个颜色之间的 WCAG 对比度，并同时给出正文级（4.5 / 7）与大字级（3 / 4.5）两套判定。适合在把配色写进代码前先验一遍。

输入参数background必填foreground必填

suggest_text_color

给一个背景色，返回一组可读的文字色候选（同色相的极浅与极深版 + 纯黑白参照），按对比度降序，标出推荐项与 AA / AAA 判定。

输入参数limitbackground必填

get_platform_snippet

取一套配色的可直接粘贴代码片段，按目标平台生成：Android colors.xml、iOS UIColor、Flutter Color、小程序 wxss、CSS 变量、SCSS 变量、Tailwind 配置。

输入参数langslug必填target必填platform

get_color_scale

从一个基准色生成 50 到 900 的 10 级色阶（500 等于基准色本身），每阶附白字与黑字的实测对比度；format 可取 list / json / css / tailwind。

输入参数color必填format

darken_palette

把一套浅色配色推导成深色版本：按固定规则重排明度与饱和度，并返回每对颜色的实测对比度。可用 slug 取库里配色，也可直接传 roles。

输入参数slugrolesplatform

版本历史

2
  1. v1.3.0最新Oct 24, 2026
  2. v1.0.0Oct 21, 2026

评分

已满足适用检查项的 90%

该评分衡量此收录条目的完整程度，依据注册中心条目、端点与公开来源计算得出。它不是对服务器本身的评价，也不表示服务器安全或当前可用：可连通性是带日期的检查结果，评分也不包含安装量或用户评价。

  • 近 30 天内可连通必需25 分
  • 已声明认证方式必需10 分
  • 已列出工具必需15 分
  • 描述必需15 分
  • 图标10 分
  • 文档15 分
  • 许可证10 分

    请在仓库或注册中心条目中声明许可证。