Developer

COLOR PALETTE

Generate beautiful color palettes from images, harmonies, and custom colors with WCAG contrast checking.

Base Color

Click two swatches to compare contrast

#0066ff vs
#ffffff
4.54
Ratio
AA Normal AA Large AAA Normal AAA Large

Palette

#0066ff
rgb(0,102,255)
Hue220
Saturation100
Lightness50

No saved palettes yet.

StoryBrain
Home Features Pricing

Build Smarter with AI

Generate stunning color palettes, extract dominant colors from images, and check WCAG contrast ratios — all in one place.

Design Accessibility AI

Frequently Asked Questions

How does the Color Palette Generator work?
Select a base color using the color picker, upload an image to extract colors, or choose a harmony rule (monochromatic, analogous, complementary, etc.). The tool generates a 5-color palette instantly — no server processing, everything stays in your browser.
Is the Color Palette Generator free to use?
Yes, it is completely free with no hidden fees, subscriptions, or usage limits. No sign-up or account required.
Can I extract colors from an image?
Yes, upload any image and the tool analyzes it using canvas APIs to extract dominant colors. The entire process happens locally in your browser.
Does this tool check color contrast for accessibility?
Yes, it calculates WCAG contrast ratios between any two colors and tells you if they pass AA or AAA requirements for normal and large text.
Can I export the palette?
You can copy individual hex codes, export the entire palette as CSS variables, JSON, or SVG swatches. All exports are one-click.
Is my uploaded image stored or sent anywhere?
No. The image is processed entirely in your browser using canvas. Nothing is uploaded to any server.
What color harmony types are supported?
Monochromatic, Analogous, Complementary, Split-Complementary, Triadic, and Tetradic — all calculated from color theory algorithms.

How to Use

01

Choose a Base Color

Use the color picker to select your starting color, or upload an image to extract colors from it.

02

Select Harmony

Pick a harmony rule (mono, analogous, complementary, triadic, etc.) to auto-generate a matching palette.

03

Lock & Refine

Lock swatches you like, adjust individual colors, and regenerate until the palette feels right.

04

Check Contrast

Use the accessibility checker to verify WCAG contrast ratios between any two palette colors.

05

Export

Copy hex codes, download as CSS variables, JSON, or SVG — ready for your design system.

How to Calculate

The Color Palette Generator uses standard color theory algorithms to generate harmonies based on HSL color space. Base colors are rotated and adjusted in hue, saturation, and lightness to create visually appealing combinations. Image extraction uses pixel sampling and color quantization to identify dominant colors.

About the Color Palette Generator

The Color Palette Generator is a free online tool for creating beautiful color palettes. Start with a single color, upload an image for inspiration, or use harmony rules like monochromatic, analogous, complementary, split-complementary, triadic, and tetradic to build the perfect palette.

Built with privacy in mind, all processing happens directly in your browser — including image analysis for color extraction. No sign-up required, no data stored, no tracking. The tool also includes a WCAG contrast checker to help you build accessible designs.

Export your palette as hex codes, CSS variables, JSON, or SVG swatches with a single click. Lock colors you love while exploring new combinations.