Color Palette Extractor

Great palettes are often found, not invented – in a sunset photo, a vintage poster or a competitor’s logo. FreePDF’s colour palette extractor analyses any image and returns its dominant colours with HEX, RGB and HSL values and the share of the image each one covers. Download the result as a swatch image, ready-to-paste CSS custom properties, JSON or a .gpl palette for GIMP and Inkscape. The analysis runs on your own device.

Common uses

• Build a website or brand palette from a mood-board photo.
• Match a presentation or social graphic to a client’s logo.
• Find the exact colours used in a screenshot or design reference.
• Create paint, interior or wedding colour schemes from inspiration pictures.
• Export palettes for illustration apps and design systems.

Tips for best results

• Fewer colours (5–6) give a cleaner, more usable palette.
• Crop busy images first so the palette focuses on the subject.
• Sort by hue to arrange colours as a smooth gradient.
• Check text and background pairs for contrast before using them in a design.
• Use the CSS variables export to drop the palette straight into a stylesheet.

How the extraction works

The image is scaled down to a manageable number of pixels, then every pixel is placed in a colour space designed to match human perception. A k-means clustering algorithm groups similar pixels and finds the average colour of each group. The largest groups become the dominant colours. Working in a perceptual space means two colours that look different to you are kept apart, even if their raw RGB numbers are close.

HEX, RGB and HSL explained

HEX (#2A9D8F) is the compact format used in HTML, CSS and most design apps. RGB lists the red, green and blue components from 0 to 255. HSL describes hue (the colour wheel angle), saturation (intensity) and lightness, which is the easiest format for making lighter or darker variations – keep the hue and change the lightness. Every swatch shows all three so you can paste whichever your tool needs.

Turning a palette into a design

A practical scheme usually has one or two dominant colours, a neutral for backgrounds and text, and an accent for buttons and highlights. Take the most common extracted colour as your base, find a contrasting accent among the rest, and test readability. The 60-30-10 rule – 60% main, 30% secondary, 10% accent – is a reliable starting point for slides, websites and rooms alike.