Color Palette Generator
Pick a color, explore palettes, convert formats, and check accessibility contrast.
Pick a Color
Color Formats (click to copy)
Palette Harmonies
WCAG Contrast Checker
Large Text Preview
Normal body text. This paragraph demonstrates how your chosen foreground color appears against the selected background. Good contrast ensures readability for all users.
Smaller text at 14px requires higher contrast ratios to pass WCAG AA (4.5:1).
AA Normal text: ratio at least 4.5:1 (14px regular, 18px bold)
AA Large text: ratio at least 3:1 (18px regular, 14px bold)
AAA Normal text: ratio at least 7:1
AAA Large text: ratio at least 4.5:1
Frequently Asked Questions
Common questions about Color Palette
Pick a base color and the tool generates harmonious palettes using color theory — complementary, analogous, triadic, and split-complementary schemes. You can also randomize to discover new combinations.
Enter your text color and background color. The tool calculates the contrast ratio and shows whether it passes WCAG AA (4.5:1 for normal text) and AAA (7:1) standards. This ensures your design is readable for people with visual impairments.
Enter any color in HEX format (e.g., #3B82F6) and the tool instantly shows the equivalent RGB and HSL values. You can also enter RGB or HSL to convert in the other direction.
Yes. Copy individual color values in any format (HEX, RGB, HSL) with one click, or export the entire palette as CSS custom properties ready to paste into your stylesheet.