Color Palette Skill

Overview

Color Palette works by generating color palettes based on color theory principles. It returns harmonious colors with multiple format outputs (HEX, RGB, HSL), accessibility metrics, ready-to-use CSS variables, and downloadable palette images.

Live Test Color Palette Skill Skill →

The tool

Once your client is connected to the VerveKit server, this appears in its tool list as ColorPaletteSkill. It is read-only and open-world — it fetches and never mutates anything on your side — so most clients call it without asking you to confirm.

Tool call

{
  "name": "ColorPaletteSkill",
  "arguments": {
    "color": "FF5733"
  }
}

You do not name the tool yourself; the model picks it. Asking about FF5733 in the terms this skill covers is enough for it to reach for ColorPaletteSkill on its own — naming it explicitly also works, and is the way to force the call.

Connecting

One server URL covers every skill in the catalog, including this one. Authorization is OAuth: the client opens a browser once, and there is no key to paste into a config file.

{
  "mcpServers": {
    "vervekit": {
      "url": "https://api.vervekit.com/v1/mcp"
    }
  }
}

Per-client setup — Claude, Cursor, VS Code, ChatGPT — is on the MCP setup page.

Arguments

These are the properties on the tool's inputSchema, so a well-behaved client validates them before the call is made. Premium arguments are accepted on every plan but only take effect on plans that include them.

Argument	Type	Description
`color`Required	string	The base color to generate the palette from (HEX format without #) hexColor
`scheme`Optional	string	The color scheme type `monocontrasttriadetetradeanalogic` default triade
`variation`Optional	string	The color variation `defaultsoftpastellighthardpale` default default
`count`OptionalPremium	integer	Caps how many colors are returned (1-16). Each scheme has its own ceiling and count cannot raise it - mono yields 4, contrast 8, triade and analogic 12, tetrade 16. The colorCount field reports how many were actually returned. Free tier limited to 5 colors default 5 · range 1–16
`distance`OptionalPremium	number	Color spacing distance (0-1). Affects triade, tetrade, and analogic schemes default 0.5 · range 0–1
`addComplement`OptionalPremium	boolean	Add complement color to analogic scheme
`webSafe`Optional	boolean	Return web-safe colors only

What the model gets back

The result carries a structuredContent object matching the tool's declared outputSchema, so a client reads fields without parsing prose. status is "ok" and error is null on success; a null field means the value was not available for that input, not that the call failed.

Result

{
  "status": "ok",
  "error": null,
  "data": {
    "source": "#FF5733",
    "sourceName": "Outrageous Orange",
    "hue": 11,
    "scheme": "triade",
    "variation": "soft",
    "distance": 0.5,
    "colorCount": 5,
    "colorPalette": [
      {
        "hex": "#CC988F",
        "name": "Oriental Pink",
        "rgb": {
          "r": 204,
          "g": 152,
          "b": 143
        },
        "hsl": {
          "h": 9,
          "s": 37,
          "l": 68
        },
        "luminance": 0.373,
        "isDark": true,
        "textColor": "#FFFFFF",
        "accessibility": {
          "contrastWithWhite": 2.48,
          "contrastWithBlack": 8.46,
          "wcagAANormal": false,
          "wcagAALarge": false,
          "wcagAAA": false
        }
      },
      {
        "hex": "#805F59",
        "name": "Russett",
        "rgb": {
          "r": 128,
          "g": 95,
          "b": 89
        },
        "hsl": {
          "h": 9,
          "s": 18,
          "l": 43
        },
        "luminance": 0.135,
        "isDark": true,
        "textColor": "#FFFFFF",
        "accessibility": {
          "contrastWithWhite": 5.68,
          "contrastWithBlack": 3.7,
          "wcagAANormal": true,
          "wcagAALarge": true,
          "wcagAAA": false
        }
      },
      {
        "hex": "#E6D2CF",
        "name": "Dust Storm",
        "rgb": {
          "r": 230,
          "g": 210,
          "b": 207
        },
        "hsl": {
          "h": 8,
          "s": 32,
          "l": 86
        },
        "luminance": 0.674,
        "isDark": false,
        "textColor": "#000000",
        "accessibility": {
          "contrastWithWhite": 1.45,
          "contrastWithBlack": 14.48,
          "wcagAANormal": true,
          "wcagAALarge": true,
          "wcagAAA": true
        }
      },
      {
        "hex": "#BF6E60",
        "name": "Contessa",
        "rgb": {
          "r": 191,
          "g": 110,
          "b": 96
        },
        "hsl": {
          "h": 9,
          "s": 43,
          "l": 56
        },
        "luminance": 0.231,
        "isDark": true,
        "textColor": "#FFFFFF",
        "accessibility": {
          "contrastWithWhite": 3.74,
          "contrastWithBlack": 5.61,
          "wcagAANormal": false,
          "wcagAALarge": true,
          "wcagAAA": false
        }
      },
      {
        "hex": "#A2CC8F",
        "name": "Pine Glade",
        "rgb": {
          "r": 162,
          "g": 204,
          "b": 143
        },
        "hsl": {
          "h": 101,
          "s": 37,
          "l": 68
        },
        "luminance": 0.529,
        "isDark": false,
        "textColor": "#000000",
        "accessibility": {
          "contrastWithWhite": 1.82,
          "contrastWithBlack": 11.57,
          "wcagAANormal": true,
          "wcagAALarge": true,
          "wcagAAA": true
        }
      }
    ],
    "colorPaletteRaw": [
      "cc988f",
      "805f59",
      "e6d2cf",
      "bf6e60",
      "a2cc8f"
    ],
    "css": ":root {\n  --primary: #CC988F;\n  --primary-rgb: 204, 152, 143;\n  --secondary: #805F59;\n  --secondary-rgb: 128, 95, 89;\n  --tertiary: #E6D2CF;\n  --tertiary-rgb: 230, 210, 207;\n  --quaternary: #BF6E60;\n  --quaternary-rgb: 191, 110, 96;\n  --quinary: #A2CC8F;\n  --quinary-rgb: 162, 204, 143;\n}",
    "image": {
      "imageName": "6ee29826-a52f-4c87-86f5-bef3b49f0dbb_palette.png",
      "format": ".png",
      "downloadURL": "https://storage.googleapis.com/apiverve/APIData/colorpalette/6ee29826-a52f-4c87-86f5-bef3b49f0dbb_palette.png?GoogleAccessId=635500398038-compute%40developer.gserviceaccount.com&Expires=1766010083&Signature=Boef5OapaNmcyp0F8bGmf%2BVfQk3zQkiWcw1THBfbsevtYGZnOuzr7xKDRlk9FYiHidSoMz6wjody2ymL7GzUoHkDvA8PEdSERhAq2z9St5yWlaX1c87KoNh%2FtCQEJqHixYk039NuYyb%2FhJu18JFY1RNrOfo8OPZEn9a3ICQdTDL0fYQEZEBxnDuc%2B7wvn4q9UFWhCJcf302HcoZoCw76AzrgVRu%2FazuahqHdVWMR1K5QTV3U51lSoqC23ERHjRZ6uZB8W0bCO65qBFrRNzWEPSVCC%2F8oafvvitZwB1YCG674q3MbtRhWXIhX2zdoPCT%2BgxL7E4fgIyXDtDLm5%2Bm%2Fsg%3D%3D",
      "expires": 1766010083748
    }
  }
}

Response fields

Paths are relative to data. Premium fields are absent rather than zeroed on plans that do not include them, so check for presence instead of comparing to 0.

Field	Type	Example	Description
`source`	string	`#FF5733`	The normalized base color the palette was generated from, in HEX format with a leading #
`sourceName`	string	`Outrageous Orange`	The human-readable color name closest to the base color
`hue`	number	`11`	The base color's position on the HSL color wheel, in degrees from 0 to 360
`scheme`	string	`triade`	The color scheme type that was used to generate the palette
`variation`	string	`soft`	The color variation that was applied to the palette
`distance`	number	`0.5`	The color spacing distance that was applied when generating the palette
`colorCount`	number	`5`	The number of colors included in the palette
`colorPalette`	array[5]		The generated palette, one entry per color with format conversions and accessibility data
`colorPalette.0.hex`	string	`#CC988F`	HEX values for each color in palette
`colorPalette.0.name`	string	`Oriental Pink`	The human-readable color name closest to this palette color
`colorPalette.0.rgb`	object	`{…}`	RGB values for each color
`colorPalette.0.rgb.r`	number	`204`
`colorPalette.0.rgb.g`	number	`152`
`colorPalette.0.rgb.b`	number	`143`
`colorPalette.0.hsl`Premium	object	`{…}`	HSL values for each color
`colorPalette.0.hsl.h`Premium	number	`9`
`colorPalette.0.hsl.s`Premium	number	`37`
`colorPalette.0.hsl.l`Premium	number	`68`
`colorPalette.0.luminance`Premium	number	`0.373`	The relative luminance (WCAG) of the color, from 0 (black) to 1 (white)
`colorPalette.0.isDark`	boolean	`true`	Whether the color is perceptually dark (relative luminance below 0.5)
`colorPalette.0.textColor`	string	`#FFFFFF`	The recommended HEX text color (white or black) to overlay on this color for legibility
`colorPalette.0.accessibility`Premium	object	`{…}`	WCAG contrast ratios and compliance
`colorPalette.0.accessibility.contrastWithWhite`Premium	number	`2.48`
`colorPalette.0.accessibility.contrastWithBlack`Premium	number	`8.46`
`colorPalette.0.accessibility.wcagAANormal`Premium	boolean	`false`
`colorPalette.0.accessibility.wcagAALarge`Premium	boolean	`false`
`colorPalette.0.accessibility.wcagAAA`Premium	boolean	`false`
`colorPaletteRaw`	array	`["cc988f","805f59","e6d2cf"]`	The palette colors as plain lowercase HEX strings without the # prefix, in the same order as colorPalette
`css`Premium	string	`:root { --primary: #CC988F; --primary-rgb: 204, 152, 143; --secondary: #805F59; --secondary-rgb: 128, 95, 89; --tertiary: #E6D2CF; --tertiary-rgb: 230, 210, 207; --quaternary: #BF6E60; --quaternary-rgb: 191, 110, 96; --quinary: #A2CC8F; --quinary-rgb: 162, 204, 143; }`	Ready-to-use CSS variables
`image`Premium	object	`{…}`	Generated palette image file details
`image.imageName`Premium	string	`6ee29826-a52f-4c87-86f5-bef3b49f0dbb_palette.png`	Filename of the generated palette image
`image.format`Premium	string	`.png`	Image file format (e.g. .png)
`image.downloadURL`Premium	string	https://storage.googleapis.com/apiverve/APIData/colorpalette/6ee29826-a52f-4c87-86f5-bef3b49f0dbb_palette.png?GoogleAccessId=635500398038-compute%40developer.gserviceaccount.com&Expires=1766010083&Signature=Boef5OapaNmcyp0F8bGmf%2BVfQk3zQkiWcw1THBfbsevtYGZnOuzr7xKDRlk9FYiHidSoMz6wjody2ymL7GzUoHkDvA8PEdSERhAq2z9St5yWlaX1c87KoNh%2FtCQEJqHixYk039NuYyb%2FhJu18JFY1RNrOfo8OPZEn9a3ICQdTDL0fYQEZEBxnDuc%2B7wvn4q9UFWhCJcf302HcoZoCw76AzrgVRu%2FazuahqHdVWMR1K5QTV3U51lSoqC23ERHjRZ6uZB8W0bCO65qBFrRNzWEPSVCC%2F8oafvvitZwB1YCG674q3MbtRhWXIhX2zdoPCT%2BgxL7E4fgIyXDtDLm5%2Bm%2Fsg%3D%3D	URL to download the generated palette image
`image.expires`Premium	number	`1766010083748`	Unix timestamp in milliseconds when the generated palette image download URL expires

Failure modes

Errors come back as tool errors carrying a sentence the model can act on, not a bare status code. Error handling covers the full list.

Status	What it means
`400` / `422`	The arguments did not validate. The message names the offending one.
`401`	The OAuth session is invalid or expired — reconnect the server.
`403`	Blocked by a key restriction or an IP allow-list. Never a bad identity.
`404`	This skill is not part of VerveKit. Check the catalog.
`429`	Out of credits, or a brief rate limit. The message tells them apart.

A call costs 2 credits each time the tool actually runs; a model that reasons about the tool without calling it costs nothing.

Use cases

Dynamic Theme Generation: White-label SaaS dashboards build branded interface themes instantly by supplying a customer's primary brand HEX to retrieve complementary UI shades and legible text colors.
Website Builder Customization: When site owners select a key accent color, CMS site editors generate matching color sets to style page headers, background sections, and button borders.
E-Commerce Product Showcases: Match catalog item tones to surrounding promotional banners by creating monochromatic or contrasting palettes directly from product hero image colors.
Design Tool Integrations: Digital illustration software presents automated analogic or triadic color swatches to artists based on their current active brush color.

Other ways to use Color Palette Skill

Set up Color Palette Skill on VerveKit, or reach the same source a different way. Your VerveKit account and credits work on all of them — one key, one balance.

Call it as a REST APIOne HTTPS endpoint and an x-api-key header, with SDKs for Node, Python and .NET.APIVerve →Reference →

Google Sheets or ExcelA =VERVE() formula fills a column — no script, no export, recalculates in place.VerveSheets →Reference →