
Color Palette Generator
Generate professional color palettes with hex codes and accessibility checks
What You Can Do
Generate professionally organized color palettes from theme descriptions, URLs, or hex codes you provide. Claude researches color standards, extracts values, organizes them dark-to-light, and produces interactive SVG reference sheets with copy-to-clipboard functionality and WCAG contrast verification. Use it to build brand guidelines, design system documentation, or quick color references for any project.
Features
research included automatically
Example Output
Example 1 — Theme-Based Palette Input: "Coral Sunset"
Output: SVG palette with 5 swatches from deep coral (#8B4545) to pale peach (#FFF0E6), each labeled with hex code, RGB, and CSS variable names. Accessibility report shows all text colors meet WCAG AA contrast on white backgrounds.
Example 2 — URL-Source Palette Input: "https://www.pantone.com/connect/color-of-the-year"
Output: Extracted palette matching Pantone's current color standard, organized light-to-dark with click-to-copy hex codes and usage notes (primary, secondary, accent roles).
Example 3 — Custom Hex Input Input: "#2C3E50, #3498DB, #E74C3C"
Output: Reorganized palette expanding your 3 colors into 5-color gradient variants, dark-to-light, with CSS variable naming (--color-dark, --color-primary, --color-light).
What's Included
- SKILL.md instruction file with research, palette structure, and SVG generation steps:
- Color research workflow: automatically fetches from URLs or searches by theme
- Accessibility verification template: WCAG contrast ratio checks for all swatches
- SVG output format: click-to-copy hex codes, CSS variable support, hover interactions
- Palette organization framework: dark-to-light slot system with role assignments (text, background, accent, highlight)
Who It's For
- Graphic designers building brand color systems and design guidelines
- UI/UX designers creating design tokens and component libraries
- Web developers needing standardized color variables and accessibility compliance
- Product managers documenting brand palettes for team alignment
- Marketing professionals ensuring brand color consistency across collateral
Best For
- Creating brand color guides from theme descriptions or Pantone references
- Generating accessible color palettes with WCAG contrast verification
- Building design system documentation with copy-to-clipboard hex codes
- Extracting and organizing color data from brand guidelines and design standards
- Producing interactive SVG reference sheets for design handoff to development teams







