Build your perfect palette
Pick a mood, lock colors you love, and press Space to randomize. Every palette is theory-aware and WCAG-checked.
Choose a Mood
Harmony Rule
Use #E07A5F as the background. Use #B9314F as the primary accent. Use #D5A18E as the secondary accent. Use #3A4F41 as the body text / supporting color. Overall palette mood: Warm Palette — warm. A warm palette with strong visual harmony. Apply these colors consistently across all UI elements, illustrations, and backgrounds.
Live Preview
Live preview — colors update with every palette change
About Warm Palettes
Warm palettes use hues from 0°–60° (reds, oranges, golds). High saturation creates energy and appetite; lower saturation reads as cozy and approachable. Warm colors advance visually — they pull the eye forward.
About ihatecolors's Generator
Theory-Aware Generation
Every palette uses one of five harmony rules — complementary, analogous, triadic, split-complementary, or tetradic — selected automatically based on your chosen mood. Colors are scored and re-generated until they pass a harmony threshold.
WCAG Accessibility
Every generated palette is automatically checked against WCAG 2.1 contrast ratio standards. You'll see live AA and AAA grades for background/text, background/accent, and accent/text combinations.
Frequently Asked Questions
How do I use this color palette generator?
Select a mood (like Warm, Cool, or Neon) from the dropdown and press Space to randomize. You can lock any color you like by clicking the lock icon, and the generator will find harmonious matches for the remaining slots.
What is color harmony?
Color harmony is the use of color theory to create combinations that are visually pleasing and balanced. Our generator uses mathematical models like complementary and analogous harmonies to ensure your website colors work together.
What is WCAG contrast?
WCAG (Web Content Accessibility Guidelines) ensures that text is readable against its background. A contrast ratio of 4.5:1 (AA) is the standard for normal text, while 7:1 (AAA) is the highest standard. We display these scores in real-time.
Can I use these palettes in Figma or Canva?
Yes. Simply click on any hex code to copy it to your clipboard, then paste it into your design tool's color picker. You can also copy the entire palette or the AI prompt for use in other workflows.