Extracted colours — tap to use:
Designing a colour scheme for a website or app. Pick a primary brand colour and the palette generator gives you harmonious accent colours that work together. Each palette type creates a different mood: complementary for bold contrast, analogous for calm harmony, triadic for variety.
Checking accessibility (WCAG contrast). Not all colour combinations are readable. The contrast checker shows whether your text-background pairing meets WCAG AA or AAA standards, for both normal and large text. Essential for accessible design.
Converting between colour formats. Need to turn a HEX code into RGB? Or an HSL value into a HEX string? The picker shows all formats simultaneously and you can input any of them. No more Googling "convert #3B82F6 to RGB".
Complementary: Two colours directly opposite on the wheel: high contrast. Split-complementary: A colour plus the two adjacent to its complement: contrast with more variety. Triadic: Three evenly spaced colours: vibrant but balanced. Tetradic: Four colours in two complementary pairs: rich but harder to balance. Analogous: Neighbouring colours: harmonious and calming. Monochromatic: Variations of one hue: subtle and elegant.
WCAG (Web Content Accessibility Guidelines) defines minimum contrast ratios for text against its background. AA requires 4.5:1 for normal text and 3:1 for large text. AAA requires 7:1 for normal text and 4.5:1 for large text. The contrast checker calculates the exact ratio for your colours.
HEX: A 6-character code like #3B82F6, commonly used in web design. RGB: Three numbers (0–255) for red, green, and blue channels, used in CSS and design tools. HSL: Hue (0-360°), Saturation (0-100%), and Lightness (0-100%). More intuitive for creating colour variations because you adjust one property at a time.
Click any colour in the palette to copy its HEX value to your clipboard. You can also copy the full palette as CSS custom properties. The picker shows HEX, RGB, and HSL values for every colour simultaneously.
Yes. Everything runs in your browser. No colour data is sent anywhere.
Most colour pickers either generate palettes or check contrast. This one does both. Six palette types, instant format conversion, WCAG contrast checking, and copy-to-clipboard on every colour. It works offline too, so you can use it in design reviews without needing internet.
No account, no sign-up, no tracking. Just a clean, fast colour tool that covers everything from palette generation to accessibility checking.
🍪 This site may use cookies for analytics. You can accept or reject personalised advertising.