playbooks

home / skills / dkyazzentwatwa / chatgpt-skills / color-palette-extractor

color-palette-extractor skill

/color-palette-extractor

This skill extracts dominant colors from images, generates cohesive palettes, and exports CSS, JSON, or swatches to streamline design workflows.

npx playbooks add skill dkyazzentwatwa/chatgpt-skills --skill color-palette-extractor

Review the files below or copy the command above to add this skill to your agents.

Files (3)
SKILL.md
1.5 KB
---
name: color-palette-extractor
description: Extract dominant colors from images, generate color palettes, and export as CSS, JSON, or ASE with K-means clustering.
---

# Color Palette Extractor

Extract dominant colors from images and generate color palettes with multiple export formats.

## Features

- **Dominant Colors**: Extract N most dominant colors using K-means
- **Color Schemes**: Generate complementary, analogous, triadic schemes
- **Multiple Formats**: Export as CSS, JSON, ASE (Adobe Swatch), ACO (Photoshop)
- **Color Analysis**: RGB, HEX, HSL, HSV values
- **Visualization**: Palette swatches, color distribution charts
- **Batch Processing**: Extract palettes from multiple images
- **Similarity Matching**: Find similar colors across palettes

## Quick Start

```python
from color_palette_extractor import ColorPaletteExtractor

extractor = ColorPaletteExtractor()

# Extract colors
extractor.load('image.jpg')
palette = extractor.extract_colors(n_colors=5)

# Export
extractor.export_css('palette.css')
extractor.export_json('palette.json')
extractor.save_swatch('swatch.png')
```

## CLI Usage

```bash
# Extract 5 colors
python color_palette_extractor.py --input image.jpg --colors 5 --output palette.json

# With CSS export
python color_palette_extractor.py --input image.jpg --colors 8 --css palette.css --swatch swatch.png

# Batch mode
python color_palette_extractor.py --batch images/ --colors 5 --output palettes/
```

## Dependencies

- pillow>=10.0.0
- scikit-learn>=1.3.0
- numpy>=1.24.0
- matplotlib>=3.7.0

Overview

This skill extracts dominant colors from images and creates usable color palettes for design and development workflows. It uses K-means clustering to identify core tones, provides color conversions (RGB, HEX, HSL, HSV), and exports palettes in CSS, JSON, ASE, and ACO formats. The tool supports visualization, batch processing, and similarity matching across palettes.

How this skill works

Load one or more images and run K-means clustering on pixel colors to identify the N most representative clusters. The skill computes color metrics (HEX, RGB, HSL, HSV), generates scheme variations (complementary, analogous, triadic), and produces swatch visualizations and distribution charts. Exporters output ready-to-use assets: CSS variables, JSON arrays, Adobe ASE, or Photoshop ACO swatches for direct consumption in design tools.

When to use it

  • Creating a color palette from a photo, product image, or illustration
  • Generating theme palettes for web or app UI with ready CSS variables
  • Batch extracting palettes for large image libraries or catalogs
  • Converting palettes into ASE/ACO for use in design applications
  • Finding matching or similar colors across multiple assets

Best practices

  • Start with a reduced image size or sampling to speed up clustering without changing color balance
  • Experiment with 5–8 colors for UI palettes; increase for complex artworks
  • Use color scheme generators (analogous/triadic) as starting points, then tweak for contrast and accessibility
  • Validate contrast ratios for text and UI elements after choosing palettes
  • Batch-process consistently named folders to keep exports organized

Example use cases

  • Extract five dominant colors from a product photo and export CSS variables for a marketing site
  • Batch-process a photography catalog to generate JSON palettes for tagging and search
  • Create ASE swatches from a brand photoshoot to import into Illustrator or Photoshop
  • Generate complementary and triadic variations to prototype theme options quickly
  • Compare palettes from multiple campaign images to ensure visual consistency

FAQ

What export formats are supported?

CSS, JSON, ASE (Adobe Swatch Exchange), and ACO (Photoshop) are supported, plus PNG swatch images.

How are dominant colors calculated?

Dominant colors are derived using K-means clustering on image pixels; you can set the number of clusters (N) to control granularity.

Can I process many images at once?

Yes. Batch mode lets you run extraction across a folder and export separate or aggregated palettes.