Color Palette Tools
Turn any image into a color palette, then refine it: edit HEX, RGB and HSL, check WCAG contrast for every color pair, preview the colors as a website theme, and export CSS or an SVG swatch sheet. Free, private and runs entirely in your browser.
How to use Color Palette Tools
- Try the synthetic example, or choose a local PNG, JPEG or WebP image. Pick the background color used for transparent pixels.
- Set 2 to 12 color slots, lock any colors you want to keep, and extract a palette into the unlocked slots.
- Select a numbered swatch to rename it or edit its HEX, RGB or HSL values. Try the suggested lighter, darker and hue-shifted neighbors, and reorder swatches.
- Check the contrast matrix for each foreground and background pair, and assign colors to website roles in the live theme preview.
- Download CSS custom properties, an SVG swatch sheet, or a recipe to pick up where you left off.
What people use it for
- Building a website color scheme from a logo, product photo or brand image
- Choosing presentation or slide-deck theme colors
- Making a mood board palette with named swatches
- Checking that text and background colors meet WCAG AA or AAA contrast
- Handing a small palette to a developer as CSS variables or an SVG swatch sheet
Frequently asked questions
Is Color Palette Tools really free?
Yes. It's free to use here in your browser and free to download. There's no account, trial or watermark.
Are my images uploaded anywhere?
No. Images are decoded and sampled in your browser, and the page blocks the tool from making any network connection. The optional recipe file saves colors and settings only, never image pixels.
What images can I use?
Still PNG, JPEG or WebP images up to 20 MiB and 25 megapixels. Transparent areas are filled with a background color you choose before colors are extracted.
How are the colors picked from the image?
The tool samples a grid of up to 256 × 256 pixels and groups similar colors with a weighted median-cut method. There's no randomness, so the same image and settings give the same palette.
How is contrast calculated?
Using the WCAG 2.2 relative luminance formula for sRGB. Pairs are rated against AA (4.5:1) and AAA (7:1) for normal text, and 3:1 and 4.5:1 for large text. A passing pair doesn't by itself make a page WCAG compliant: size, weight and context still matter.
Can I keep some colors fixed?
Yes. Lock a color to protect it from edits, extraction and removal. Extraction only fills the unlocked slots.
What can I export?
CSS custom properties, an SVG swatch sheet with color names and values, and an optional recipe that saves your colors, locks and theme roles so you can continue later.
Is it suitable for print or CMYK work?
No. Colors are 8-bit sRGB for screens. It isn't a color-managed print proof, CMYK converter or calibrated measurement tool.
Can I use it offline?
Yes. Click Download to save the tool as a single HTML file, then open it in any current desktop browser, with or without an internet connection.
Private by design
This tool is a single HTML file that runs entirely in your browser. The page that hosts it blocks every outgoing network connection from the tool, so the files you open are processed on your device and are never sent to AppKatz or anyone else. Download it once and it keeps working offline.
Take it further with AppKatz
Affordable Windows apps for small businesses. Buy once, own forever, no subscriptions.
