Color Scheme Generator

This tool analyzes the pixels in your image to find the most prominent colors using a median-cut color quantization algorithm, entirely client-side.

Color Extraction

• Pixel Sampling: The image is drawn to a canvas and its pixel data is read. Large images are downscaled for speed
• Median Cut: The RGB color space is recursively split along the axis with the greatest range, producing clusters of similar colors
• Dominant Colors: Each cluster is averaged to produce a representative color, weighted by the number of pixels it contains

Output Formats

• HEX: Standard 6-digit hex codes (e.g. #3A7BD5)
• RGB: Red, green, blue components 0-255
• HSL: Hue (0-360), saturation (%), lightness (%)
• CSS Variables: Ready-to-use custom properties for your stylesheet

Tips

• Click any color card to copy its value to the clipboard
• Use the slider to adjust how many colors are extracted (3 to 12)
• Photos with distinct color regions produce the clearest palettes
• Your image never leaves your browser — all processing is local

You can embed this util on your own site as a widget. Adding ?embed=1 to the URL loads a compact version with just the tool itself; no header, menu, or documentation. Paste this snippet into your HTML:

Copy snippet Adjust the height to taste.