# Palette
Core palette generation — compute palettes, color systems, harmonies, dominant colors, and export to various code formats.
## Generate a color palette
> Generate a complete color palette from base and theme configurations. Returns the full \`PaletteData\` object produced by the palette engine.
```json
{"openapi":"3.1.0","info":{"title":"UI Color Palette API","version":"1.0.0"},"tags":[{"name":"Palette","description":"Core palette generation — compute palettes, color systems, harmonies, dominant colors, and export to various code formats.\n"}],"servers":[{"url":"https://api-uicp.yelbolt.workers.dev/v1","description":"Production"}],"paths":{"/get-palette":{"post":{"operationId":"getPalette","summary":"Generate a color palette","description":"Generate a complete color palette from base and theme configurations. Returns the full `PaletteData` object produced by the palette engine.\n","tags":["Palette"],"requestBody":{"required":true,"content":{"application/json":{"schema":{"type":"object","required":["base","themes"],"properties":{"base":{"$ref":"#/components/schemas/BaseConfiguration"},"themes":{"type":"array","items":{"$ref":"#/components/schemas/ThemeConfiguration"},"minItems":1},"includeLibraryData":{"type":"boolean","default":false,"description":"Include internal library metadata in the response."},"compact":{"type":"boolean","default":false,"description":"Return a compact (lighter) representation of the palette."}}}}}},"responses":{"200":{"description":"Palette data","content":{"application/json":{"schema":{"type":"object","description":"Full `PaletteData` object. Shape depends on the palette engine version and `compact` flag.\n"}}}},"400":{"description":"Invalid input","content":{"application/json":{"schema":{"$ref":"#/components/schemas/ErrorResponse"}}}},"500":{"description":"Internal error","content":{"application/json":{"schema":{"$ref":"#/components/schemas/ErrorResponse"}}}}}}}},"components":{"schemas":{"BaseConfiguration":{"type":"object","required":["preset","colors"],"properties":{"preset":{"$ref":"#/components/schemas/PresetConfiguration"},"colors":{"type":"array","items":{"$ref":"#/components/schemas/ColorConfiguration"},"minItems":1}}},"PresetConfiguration":{"type":"object","required":["id","name","stops","min","max","easing"],"properties":{"id":{"type":"string","description":"Unique identifier for the preset. Auto-generated if omitted on creation."},"name":{"type":"string"},"stops":{"type":"array","items":{"type":"integer","minimum":0}},"min":{"type":"number","minimum":0,"maximum":100},"max":{"type":"number","minimum":0,"maximum":100},"easing":{"$ref":"#/components/schemas/EasingFunction"}}},"EasingFunction":{"type":"string","enum":["NONE","LINEAR","EASEIN_SINE","EASEOUT_SINE","EASEINOUT_SINE","EASEIN_QUAD","EASEOUT_QUAD","EASEINOUT_QUAD","EASEIN_CUBIC","EASEOUT_CUBIC","EASEINOUT_CUBIC"]},"ColorConfiguration":{"type":"object","required":["name","rgb","hue","chroma","alpha"],"properties":{"id":{"type":"string","description":"Auto-generated if omitted."},"name":{"type":"string"},"rgb":{"$ref":"#/components/schemas/RgbChannel"},"hue":{"type":"object","required":["shift","isLocked"],"properties":{"shift":{"type":"number"},"isLocked":{"type":"boolean"}}},"chroma":{"type":"object","required":["shift","isLocked"],"properties":{"shift":{"type":"number"},"isLocked":{"type":"boolean"}}},"alpha":{"type":"object","required":["isEnabled","backgroundColor"],"properties":{"isEnabled":{"type":"boolean"},"backgroundColor":{"$ref":"#/components/schemas/HexColor"}}}}},"RgbChannel":{"type":"object","required":["r","g","b"],"properties":{"r":{"type":"number","minimum":0,"maximum":1},"g":{"type":"number","minimum":0,"maximum":1},"b":{"type":"number","minimum":0,"maximum":1}}},"HexColor":{"type":"string","pattern":"^#[0-9a-fA-F]{3,8}$"},"ThemeConfiguration":{"type":"object","required":["name"],"properties":{"id":{"type":"string","description":"Auto-generated if omitted."},"name":{"type":"string"},"scale":{"type":"object","description":"Map of stop names to lightness values (0–100). When omitted the preset stops are used unchanged.\n","additionalProperties":{"type":"number","minimum":0,"maximum":100}},"paletteBackground":{"$ref":"#/components/schemas/HexColor"},"textColorsTheme":{"type":"object","required":["lightColor","darkColor"],"properties":{"lightColor":{"$ref":"#/components/schemas/HexColor"},"darkColor":{"$ref":"#/components/schemas/HexColor"}}},"visionSimulationMode":{"$ref":"#/components/schemas/VisionSimulationMode"},"type":{"type":"string","enum":["default theme","custom theme"]}}},"VisionSimulationMode":{"type":"string","enum":["NONE","PROTANOMALY","PROTANOPIA","DEUTERANOMALY","DEUTERANOPIA","TRITANOMALY","TRITANOPIA","ACHROMATOMALY","ACHROMATOPSIA"]},"ErrorResponse":{"type":"object","required":["message"],"properties":{"message":{"type":"string"}}}}}}
```
## Build a semantic color system
> Resolves taxonomy bindings against a generated palette to produce a semantic \`SystemData\` object. Requires \`@a\_ng\_d/utils-ui-color-palette >= 1.10.0\` on the worker.
```json
{"openapi":"3.1.0","info":{"title":"UI Color Palette API","version":"1.0.0"},"tags":[{"name":"Palette","description":"Core palette generation — compute palettes, color systems, harmonies, dominant colors, and export to various code formats.\n"}],"servers":[{"url":"https://api-uicp.yelbolt.workers.dev/v1","description":"Production"}],"paths":{"/get-color-system":{"post":{"operationId":"getColorSystem","summary":"Build a semantic color system","description":"Resolves taxonomy bindings against a generated palette to produce a semantic `SystemData` object. Requires `@a_ng_d/utils-ui-color-palette >= 1.10.0` on the worker.\n","tags":["Palette"],"requestBody":{"required":true,"content":{"application/json":{"schema":{"type":"object","required":["base","themes","system"],"properties":{"base":{"$ref":"#/components/schemas/BaseConfiguration"},"themes":{"type":"array","items":{"$ref":"#/components/schemas/ThemeConfiguration"},"minItems":1},"system":{"$ref":"#/components/schemas/SystemConfiguration"}}}}}},"responses":{"200":{"description":"System data","content":{"application/json":{"schema":{"type":"object","description":"`SystemData` object produced by the palette engine.\n"}}}},"400":{"description":"Missing or invalid system configuration","content":{"application/json":{"schema":{"$ref":"#/components/schemas/ErrorResponse"}}}},"500":{"description":"Internal error","content":{"application/json":{"schema":{"$ref":"#/components/schemas/ErrorResponse"}}}},"501":{"description":"System class unavailable (worker dependency too old)","content":{"application/json":{"schema":{"$ref":"#/components/schemas/ErrorResponse"}}}}}}}},"components":{"schemas":{"BaseConfiguration":{"type":"object","required":["preset","colors"],"properties":{"preset":{"$ref":"#/components/schemas/PresetConfiguration"},"colors":{"type":"array","items":{"$ref":"#/components/schemas/ColorConfiguration"},"minItems":1}}},"PresetConfiguration":{"type":"object","required":["id","name","stops","min","max","easing"],"properties":{"id":{"type":"string","description":"Unique identifier for the preset. Auto-generated if omitted on creation."},"name":{"type":"string"},"stops":{"type":"array","items":{"type":"integer","minimum":0}},"min":{"type":"number","minimum":0,"maximum":100},"max":{"type":"number","minimum":0,"maximum":100},"easing":{"$ref":"#/components/schemas/EasingFunction"}}},"EasingFunction":{"type":"string","enum":["NONE","LINEAR","EASEIN_SINE","EASEOUT_SINE","EASEINOUT_SINE","EASEIN_QUAD","EASEOUT_QUAD","EASEINOUT_QUAD","EASEIN_CUBIC","EASEOUT_CUBIC","EASEINOUT_CUBIC"]},"ColorConfiguration":{"type":"object","required":["name","rgb","hue","chroma","alpha"],"properties":{"id":{"type":"string","description":"Auto-generated if omitted."},"name":{"type":"string"},"rgb":{"$ref":"#/components/schemas/RgbChannel"},"hue":{"type":"object","required":["shift","isLocked"],"properties":{"shift":{"type":"number"},"isLocked":{"type":"boolean"}}},"chroma":{"type":"object","required":["shift","isLocked"],"properties":{"shift":{"type":"number"},"isLocked":{"type":"boolean"}}},"alpha":{"type":"object","required":["isEnabled","backgroundColor"],"properties":{"isEnabled":{"type":"boolean"},"backgroundColor":{"$ref":"#/components/schemas/HexColor"}}}}},"RgbChannel":{"type":"object","required":["r","g","b"],"properties":{"r":{"type":"number","minimum":0,"maximum":1},"g":{"type":"number","minimum":0,"maximum":1},"b":{"type":"number","minimum":0,"maximum":1}}},"HexColor":{"type":"string","pattern":"^#[0-9a-fA-F]{3,8}$"},"ThemeConfiguration":{"type":"object","required":["name"],"properties":{"id":{"type":"string","description":"Auto-generated if omitted."},"name":{"type":"string"},"scale":{"type":"object","description":"Map of stop names to lightness values (0–100). When omitted the preset stops are used unchanged.\n","additionalProperties":{"type":"number","minimum":0,"maximum":100}},"paletteBackground":{"$ref":"#/components/schemas/HexColor"},"textColorsTheme":{"type":"object","required":["lightColor","darkColor"],"properties":{"lightColor":{"$ref":"#/components/schemas/HexColor"},"darkColor":{"$ref":"#/components/schemas/HexColor"}}},"visionSimulationMode":{"$ref":"#/components/schemas/VisionSimulationMode"},"type":{"type":"string","enum":["default theme","custom theme"]}}},"VisionSimulationMode":{"type":"string","enum":["NONE","PROTANOMALY","PROTANOPIA","DEUTERANOMALY","DEUTERANOPIA","TRITANOMALY","TRITANOPIA","ACHROMATOMALY","ACHROMATOPSIA"]},"SystemConfiguration":{"type":"object","required":["schema"],"properties":{"schema":{"$ref":"#/components/schemas/TaxonomySchema"},"bindings":{"type":"array","items":{"$ref":"#/components/schemas/TaxonomyBinding"}}}},"TaxonomySchema":{"type":"object","required":["groups"],"properties":{"groups":{"type":"array","items":{"$ref":"#/components/schemas/TaxonomyGroup"}}}},"TaxonomyGroup":{"type":"object","required":["id","name","members"],"properties":{"id":{"type":"string"},"name":{"type":"string"},"members":{"type":"array","items":{"$ref":"#/components/schemas/TaxonomyGroupMember"}}}},"TaxonomyGroupMember":{"type":"object","required":["id","name"],"properties":{"id":{"type":"string"},"name":{"type":"string"}}},"TaxonomyBinding":{"type":"object","required":["path","ref"],"properties":{"path":{"type":"array","items":{"type":"string"},"description":"Hierarchical path that identifies a semantic token (e.g. `[\"brand\", \"primary\"]`).\n"},"description":{"type":"string"},"ref":{"type":"string","description":"Reference to a palette color, formatted as `/` (e.g. `Blue/500`).\n"},"overrides":{"type":"object","description":"Per-theme stop overrides keyed by theme name.","additionalProperties":{"type":"string"}},"isExcluded":{"type":"boolean","default":false}}},"ErrorResponse":{"type":"object","required":["message"],"properties":{"message":{"type":"string"}}}}}}
```
## Generate color harmonies
> Compute one or all color harmonies (complementary, analogous, triadic, etc.) from a base color.
```json
{"openapi":"3.1.0","info":{"title":"UI Color Palette API","version":"1.0.0"},"tags":[{"name":"Palette","description":"Core palette generation — compute palettes, color systems, harmonies, dominant colors, and export to various code formats.\n"}],"servers":[{"url":"https://api-uicp.yelbolt.workers.dev/v1","description":"Production"}],"paths":{"/create-color-harmony":{"post":{"operationId":"createColorHarmony","summary":"Generate color harmonies","description":"Compute one or all color harmonies (complementary, analogous, triadic, etc.) from a base color.\n","tags":["Palette"],"requestBody":{"required":true,"content":{"application/json":{"schema":{"type":"object","required":["baseColor"],"properties":{"baseColor":{"$ref":"#/components/schemas/Channel"},"analogousSpread":{"type":"number","description":"Spread angle (in degrees) used for analogous harmonies.\n"},"returnFormat":{"type":"string","enum":["rgb","hex","both"],"default":"both","description":"Output format for each color in the result."},"type":{"oneOf":[{"$ref":"#/components/schemas/HarmonyType"},{"type":"string","enum":["ALL"]}],"default":"ALL","description":"Harmony to compute. Use `ALL` (default) to get every harmony at once.\n"}}}}}},"responses":{"200":{"description":"Harmony result","content":{"application/json":{"schema":{"oneOf":[{"$ref":"#/components/schemas/HarmonyColors"},{"type":"object","description":"When `type` is `ALL`, an object keyed by harmony name, each value following the `HarmonyColors` shape.\n","additionalProperties":{"$ref":"#/components/schemas/HarmonyColors"}}]}}}},"500":{"description":"Internal error","content":{"application/json":{"schema":{"$ref":"#/components/schemas/ErrorResponse"}}}}}}}},"components":{"schemas":{"Channel":{"type":"object","description":"Color channel values as defined by `@a_ng_d/utils-ui-color-palette`. At minimum provide an `rgb` object; additional channels (lch, oklch, etc.) may be included.\n","properties":{"rgb":{"$ref":"#/components/schemas/RgbChannel"}},"additionalProperties":true},"RgbChannel":{"type":"object","required":["r","g","b"],"properties":{"r":{"type":"number","minimum":0,"maximum":1},"g":{"type":"number","minimum":0,"maximum":1},"b":{"type":"number","minimum":0,"maximum":1}}},"HarmonyType":{"type":"string","enum":["COMPLEMENTARY","ANALOGOUS","TRIADIC","SPLIT_COMPLEMENTARY","TETRADIC","SQUARE","SHADES"]},"HarmonyColors":{"type":"object","description":"A set of colors forming the requested harmony. Keys depend on the harmony type (e.g. `complementary`, `analogous1`, `analogous2`). Values follow the `Channel` shape and include both `rgb` and `hex` representations when `returnFormat` is `both`.\n","additionalProperties":true},"ErrorResponse":{"type":"object","required":["message"],"properties":{"message":{"type":"string"}}}}}}
```
## Extract dominant colors from an image
> Extract the most prominent colors from a JPEG or PNG image. The image can be supplied in three ways:\
> 1\. \*\*Multipart upload\*\* — \`Content-Type: multipart/form-data\` with an\
> \`image\` file field.\
> 2\. \*\*URL\*\* — JSON body with \`imageUrl\`. 3. \*\*Raw pixel data\*\* — JSON body with \`imageData\`\
> \`{ data: number\[], width, height }\`.
```json
{"openapi":"3.1.0","info":{"title":"UI Color Palette API","version":"1.0.0"},"tags":[{"name":"Palette","description":"Core palette generation — compute palettes, color systems, harmonies, dominant colors, and export to various code formats.\n"}],"servers":[{"url":"https://api-uicp.yelbolt.workers.dev/v1","description":"Production"}],"paths":{"/extract-dominant-colors":{"post":{"operationId":"extractDominantColors","summary":"Extract dominant colors from an image","description":"Extract the most prominent colors from a JPEG or PNG image. The image can be supplied in three ways:\n1. **Multipart upload** — `Content-Type: multipart/form-data` with an\n `image` file field.\n2. **URL** — JSON body with `imageUrl`. 3. **Raw pixel data** — JSON body with `imageData`\n `{ data: number[], width, height }`.\n","tags":["Palette"],"requestBody":{"required":true,"content":{"multipart/form-data":{"schema":{"type":"object","required":["image"],"properties":{"image":{"type":"string","format":"binary","description":"JPEG or PNG image file."},"colorCount":{"type":"integer","description":"Number of dominant colors to extract."},"maxIterations":{"type":"integer","description":"Maximum k-means iterations."},"tolerance":{"type":"number","description":"Convergence tolerance."},"skipTransparent":{"type":"string","enum":["true","false"],"description":"Skip fully transparent pixels."}}}},"application/json":{"schema":{"type":"object","properties":{"imageUrl":{"type":"string","format":"uri","description":"Publicly accessible URL of a JPEG or PNG image."},"imageData":{"type":"object","description":"Raw RGBA pixel buffer.","required":["data","width","height"],"properties":{"data":{"type":"array","items":{"type":"integer"},"description":"Flat RGBA byte array."},"width":{"type":"integer"},"height":{"type":"integer"}}},"colorCount":{"type":"integer"},"maxIterations":{"type":"integer"},"tolerance":{"type":"number"},"skipTransparent":{"type":"boolean"}}}}}},"responses":{"200":{"description":"List of dominant colors","content":{"application/json":{"schema":{"type":"array","items":{"$ref":"#/components/schemas/DominantColor"}}}}},"400":{"description":"Missing or invalid input","content":{"application/json":{"schema":{"$ref":"#/components/schemas/ErrorResponse"}}}},"500":{"description":"Internal error","content":{"application/json":{"schema":{"$ref":"#/components/schemas/ErrorResponse"}}}}}}}},"components":{"schemas":{"DominantColor":{"type":"object","properties":{"hex":{"$ref":"#/components/schemas/HexColor"},"rgb":{"$ref":"#/components/schemas/RgbChannel"},"population":{"type":"number","description":"Relative frequency of this color in the image (0–1)."}}},"HexColor":{"type":"string","pattern":"^#[0-9a-fA-F]{3,8}$"},"RgbChannel":{"type":"object","required":["r","g","b"],"properties":{"r":{"type":"number","minimum":0,"maximum":1},"g":{"type":"number","minimum":0,"maximum":1},"b":{"type":"number","minimum":0,"maximum":1}}},"ErrorResponse":{"type":"object","required":["message"],"properties":{"message":{"type":"string"}}}}}}
```
## Generate design tokens / code
> Generate platform-specific design tokens or code from a palette. Accepts \`base\` + \`themes\` (not a pre-built \`paletteData\` object). Optionally pass a \`system\` to include semantic tokens.
```json
{"openapi":"3.1.0","info":{"title":"UI Color Palette API","version":"1.0.0"},"tags":[{"name":"Palette","description":"Core palette generation — compute palettes, color systems, harmonies, dominant colors, and export to various code formats.\n"}],"servers":[{"url":"https://api-uicp.yelbolt.workers.dev/v1","description":"Production"}],"paths":{"/generate-code":{"post":{"operationId":"generateCode","summary":"Generate design tokens / code","description":"Generate platform-specific design tokens or code from a palette. Accepts `base` + `themes` (not a pre-built `paletteData` object). Optionally pass a `system` to include semantic tokens.\n","tags":["Palette"],"requestBody":{"required":true,"content":{"application/json":{"schema":{"type":"object","required":["base","themes"],"properties":{"base":{"$ref":"#/components/schemas/BaseConfiguration"},"themes":{"type":"array","items":{"$ref":"#/components/schemas/ThemeConfiguration"},"minItems":1},"format":{"$ref":"#/components/schemas/CodeFormat"},"colorSpace":{"$ref":"#/components/schemas/ColorSpace"},"system":{"$ref":"#/components/schemas/SystemConfiguration"}}}}}},"responses":{"200":{"description":"Generated code as a string or structured object depending on the format.","content":{"application/json":{"schema":{"oneOf":[{"type":"string","description":"For text-based formats (css, scss, less, swift-ui, etc.)"},{"type":"object","description":"For structured formats (tailwind-v3/v4, dtcg-tokens, etc.)","additionalProperties":true}]}}}},"400":{"description":"Unknown format or invalid input","content":{"application/json":{"schema":{"$ref":"#/components/schemas/ErrorResponse"}}}},"500":{"description":"Internal error","content":{"application/json":{"schema":{"$ref":"#/components/schemas/ErrorResponse"}}}},"501":{"description":"System class unavailable","content":{"application/json":{"schema":{"$ref":"#/components/schemas/ErrorResponse"}}}}}}}},"components":{"schemas":{"BaseConfiguration":{"type":"object","required":["preset","colors"],"properties":{"preset":{"$ref":"#/components/schemas/PresetConfiguration"},"colors":{"type":"array","items":{"$ref":"#/components/schemas/ColorConfiguration"},"minItems":1}}},"PresetConfiguration":{"type":"object","required":["id","name","stops","min","max","easing"],"properties":{"id":{"type":"string","description":"Unique identifier for the preset. Auto-generated if omitted on creation."},"name":{"type":"string"},"stops":{"type":"array","items":{"type":"integer","minimum":0}},"min":{"type":"number","minimum":0,"maximum":100},"max":{"type":"number","minimum":0,"maximum":100},"easing":{"$ref":"#/components/schemas/EasingFunction"}}},"EasingFunction":{"type":"string","enum":["NONE","LINEAR","EASEIN_SINE","EASEOUT_SINE","EASEINOUT_SINE","EASEIN_QUAD","EASEOUT_QUAD","EASEINOUT_QUAD","EASEIN_CUBIC","EASEOUT_CUBIC","EASEINOUT_CUBIC"]},"ColorConfiguration":{"type":"object","required":["name","rgb","hue","chroma","alpha"],"properties":{"id":{"type":"string","description":"Auto-generated if omitted."},"name":{"type":"string"},"rgb":{"$ref":"#/components/schemas/RgbChannel"},"hue":{"type":"object","required":["shift","isLocked"],"properties":{"shift":{"type":"number"},"isLocked":{"type":"boolean"}}},"chroma":{"type":"object","required":["shift","isLocked"],"properties":{"shift":{"type":"number"},"isLocked":{"type":"boolean"}}},"alpha":{"type":"object","required":["isEnabled","backgroundColor"],"properties":{"isEnabled":{"type":"boolean"},"backgroundColor":{"$ref":"#/components/schemas/HexColor"}}}}},"RgbChannel":{"type":"object","required":["r","g","b"],"properties":{"r":{"type":"number","minimum":0,"maximum":1},"g":{"type":"number","minimum":0,"maximum":1},"b":{"type":"number","minimum":0,"maximum":1}}},"HexColor":{"type":"string","pattern":"^#[0-9a-fA-F]{3,8}$"},"ThemeConfiguration":{"type":"object","required":["name"],"properties":{"id":{"type":"string","description":"Auto-generated if omitted."},"name":{"type":"string"},"scale":{"type":"object","description":"Map of stop names to lightness values (0–100). When omitted the preset stops are used unchanged.\n","additionalProperties":{"type":"number","minimum":0,"maximum":100}},"paletteBackground":{"$ref":"#/components/schemas/HexColor"},"textColorsTheme":{"type":"object","required":["lightColor","darkColor"],"properties":{"lightColor":{"$ref":"#/components/schemas/HexColor"},"darkColor":{"$ref":"#/components/schemas/HexColor"}}},"visionSimulationMode":{"$ref":"#/components/schemas/VisionSimulationMode"},"type":{"type":"string","enum":["default theme","custom theme"]}}},"VisionSimulationMode":{"type":"string","enum":["NONE","PROTANOMALY","PROTANOPIA","DEUTERANOMALY","DEUTERANOPIA","TRITANOMALY","TRITANOPIA","ACHROMATOMALY","ACHROMATOPSIA"]},"CodeFormat":{"type":"string","enum":["css","scss","less","tailwind-v3","tailwind-v4","swift-ui","ui-kit","compose","resources","csv","native-tokens","dtcg-tokens","style-dictionary-v3","universal-json"]},"ColorSpace":{"type":"string","enum":["LCH","OKLCH","LAB","OKLAB","HSL","HSLUV","HSV","CMYK","RGB","HEX","P3"]},"SystemConfiguration":{"type":"object","required":["schema"],"properties":{"schema":{"$ref":"#/components/schemas/TaxonomySchema"},"bindings":{"type":"array","items":{"$ref":"#/components/schemas/TaxonomyBinding"}}}},"TaxonomySchema":{"type":"object","required":["groups"],"properties":{"groups":{"type":"array","items":{"$ref":"#/components/schemas/TaxonomyGroup"}}}},"TaxonomyGroup":{"type":"object","required":["id","name","members"],"properties":{"id":{"type":"string"},"name":{"type":"string"},"members":{"type":"array","items":{"$ref":"#/components/schemas/TaxonomyGroupMember"}}}},"TaxonomyGroupMember":{"type":"object","required":["id","name"],"properties":{"id":{"type":"string"},"name":{"type":"string"}}},"TaxonomyBinding":{"type":"object","required":["path","ref"],"properties":{"path":{"type":"array","items":{"type":"string"},"description":"Hierarchical path that identifies a semantic token (e.g. `[\"brand\", \"primary\"]`).\n"},"description":{"type":"string"},"ref":{"type":"string","description":"Reference to a palette color, formatted as `/` (e.g. `Blue/500`).\n"},"overrides":{"type":"object","description":"Per-theme stop overrides keyed by theme name.","additionalProperties":{"type":"string"}},"isExcluded":{"type":"boolean","default":false}}},"ErrorResponse":{"type":"object","required":["message"],"properties":{"message":{"type":"string"}}}}}}
```
## Preview palette as SVG
> Render a palette as an SVG swatch grid. The \`data\` query parameter uses a compact encoding:\
> \`\`\` \\~\\~\:\\[,\:\]\[;\\~...]\[|\\~...] \`\`\`\
> \- \`|\` separates themes - \`;\` separates colors within a theme - \`\~\` separates the name from shade pairs - \`,\` separates individual shade:hex pairs - \`:\` separates a shade name from its 6-digit hex value (without \`#\`)\
> Values must be URL-encoded when they contain special characters.
````json
{"openapi":"3.1.0","info":{"title":"UI Color Palette API","version":"1.0.0"},"tags":[{"name":"Palette","description":"Core palette generation — compute palettes, color systems, harmonies, dominant colors, and export to various code formats.\n"}],"servers":[{"url":"https://api-uicp.yelbolt.workers.dev/v1","description":"Production"}],"paths":{"/preview":{"get":{"operationId":"previewPalette","summary":"Preview palette as SVG","description":"Render a palette as an SVG swatch grid. The `data` query parameter uses a compact encoding:\n``` ~~:[,:][;~...][|~...] ```\n- `|` separates themes - `;` separates colors within a theme - `~` separates the name from shade pairs - `,` separates individual shade:hex pairs - `:` separates a shade name from its 6-digit hex value (without `#`)\nValues must be URL-encoded when they contain special characters.\n","tags":["Palette"],"parameters":[{"name":"data","in":"query","required":true,"description":"Compact palette data string.","schema":{"type":"string"}}],"responses":{"200":{"description":"SVG swatch grid","content":{"image/svg+xml":{"schema":{"type":"string","format":"binary"}}},"headers":{"Cache-Control":{"schema":{"type":"string"}}}},"400":{"description":"Missing or invalid `data` parameter","content":{"text/plain":{"schema":{"type":"string"}}}}}}}}}
````
---
# Agent Instructions: Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.
Perform an HTTP GET request on the current page URL with the `ask` query parameter:
```
GET https://docs.ui-color-palette.com/api-reference/palette.md?ask=
```
The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.
Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.