ColorPickr
Contrast checks with fixes, OKLCH harmonies, palettes, color-blind previews and code export.
我该使用它吗
质量与安全性
基于对工具定义和协议合规性的自动分析。
上下文开销
这是每次将服务器的工具加载到模型上下文窗口时所消耗的大致 token 数。数值越高,可用于其他任务的注意力就越少。
安装
一键安装
将以下内容添加到你的 `claude_desktop_config.json` 文件中:
{
"mcpServers": {
"colorpickr": {
"url": "https://colorpickr.app/mcp"
}
}
}远程端点
https://colorpickr.app/mcpstreamable-http它能做什么
工具清单
工具(6)
🟢check_contrast(text, background)
Check text/background contrast with WCAG 2 ratio, APCA Lc and a suggested fix that keeps the hue.
输入模式
{
"type": "object",
"properties": {
"text": {
"type": "string",
"pattern": "^#?([0-9a-fA-F]{3}|[0-9a-fA-F]{6})$",
"description": "Text color hex."
},
"background": {
"type": "string",
"pattern": "^#?([0-9a-fA-F]{3}|[0-9a-fA-F]{6})$",
"description": "Background color hex."
}
},
"required": [
"text",
"background"
],
"$schema": "https://json-schema.org/draft/2020-12/schema",
"additionalProperties": false
}🟢convert_color(hex)
Convert a hex color to RGB, HSL and OKLCH.
输入模式
{
"type": "object",
"properties": {
"hex": {
"type": "string",
"pattern": "^#?([0-9a-fA-F]{3}|[0-9a-fA-F]{6})$",
"description": "Color hex."
}
},
"required": [
"hex"
],
"$schema": "https://json-schema.org/draft/2020-12/schema",
"additionalProperties": false
}🟢generate_harmony(base, type)
Build a color harmony from a base color in OKLCH, mapped into the sRGB gamut.
输入模式
{
"type": "object",
"properties": {
"base": {
"type": "string",
"pattern": "^#?([0-9a-fA-F]{3}|[0-9a-fA-F]{6})$",
"description": "Base color hex."
},
"type": {
"type": "string",
"enum": [
"complementary",
"analogous",
"triadic",
"split",
"tetradic",
"monochromatic"
]
}
},
"required": [
"base",
"type"
],
"$schema": "https://json-schema.org/draft/2020-12/schema",
"additionalProperties": false
}🟢roll_palette(locked, seed)
Generate a 5-color palette that always contains a light/dark pair passing WCAG AA; optionally keep locked colors.
输入模式
{
"type": "object",
"properties": {
"locked": {
"description": "Colors to keep, in order.",
"maxItems": 5,
"type": "array",
"items": {
"type": "string",
"pattern": "^#?([0-9a-fA-F]{3}|[0-9a-fA-F]{6})$"
}
},
"seed": {
"description": "Seed for repeatable results.",
"type": "integer",
"minimum": -9007199254740991,
"maximum": 9007199254740991
}
},
"$schema": "https://json-schema.org/draft/2020-12/schema",
"additionalProperties": false
}🟢export_palette(colors, format)
Turn a list of colors into code for CSS, Tailwind, SwiftUI, Android, Flutter and other formats ColorPickr supports.
输入模式
{
"type": "object",
"properties": {
"colors": {
"minItems": 1,
"maxItems": 32,
"type": "array",
"items": {
"type": "string",
"pattern": "^#?([0-9a-fA-F]{3}|[0-9a-fA-F]{6})$"
}
},
"format": {
"type": "string",
"enum": [
"CSS variables",
"Tailwind v4",
"shadcn/ui",
"Figma variables",
"W3C Design Tokens",
"SwiftUI",
"Xcode asset catalog",
"Android",
"SCSS",
"Material UI",
"Flutter",
"Jetpack Compose",
"CSV",
"Adobe .ase",
"Apple .clr",
"Procreate .swatches"
]
}
},
"required": [
"colors",
"format"
],
"$schema": "https://json-schema.org/draft/2020-12/schema",
"additionalProperties": false
}🟢simulate_color_vision(colors, type, severity)
Show how colors look with protanopia, deuteranopia, tritanopia or achromatopsia (Machado 2009).
输入模式
{
"type": "object",
"properties": {
"colors": {
"minItems": 1,
"maxItems": 32,
"type": "array",
"items": {
"type": "string",
"pattern": "^#?([0-9a-fA-F]{3}|[0-9a-fA-F]{6})$"
}
},
"type": {
"type": "string",
"enum": [
"protanopia",
"deuteranopia",
"tritanopia",
"achromatopsia"
]
},
"severity": {
"default": 1,
"type": "number",
"minimum": 0,
"maximum": 1
}
},
"required": [
"colors",
"type"
],
"$schema": "https://json-schema.org/draft/2020-12/schema",
"additionalProperties": false
}社区
证据