Pick a base color from the color wheel and generate harmonious palettes using complementary, analogous, triadic, and other color theory rules. Export in HEX, RGB, and HSL.
| Color | HEX | RGB | HSL | |
|---|---|---|---|---|
#1 | #64F2EF | rgb(100, 242, 239) | hsl(179, 84%, 67%) | |
#2 | #64ADF2 | rgb(100, 173, 242) | hsl(209, 84%, 67%) | |
#3 | #6467F2 | rgb(100, 103, 242) | hsl(239, 84%, 67%) | |
#4 | #A864F2 | rgb(168, 100, 242) | hsl(269, 84%, 67%) | |
#5 | #EF64F2 | rgb(239, 100, 242) | hsl(299, 84%, 67%) |
Color theory is the foundation of effective visual design. It provides a systematic framework for combining colors that are aesthetically harmonious and functionally accessible. At its core, color theory uses the color wheel — a circular arrangement of hues — to define relationships between colors that naturally look good together.
The main harmony types are: complementary (colors opposite each other on the wheel, creating high contrast), analogous (colors adjacent on the wheel, creating a cohesive and calming feel), triadic (three colors equally spaced, offering vibrant variety with balance), split-complementary (a base color plus two colors adjacent to its complement, for contrast with less tension), and tetradic (four colors forming a rectangle on the wheel, for rich multi-color schemes).
In web design, a well-chosen palette typically consists of a primary brand color, a secondary accent, neutral tones for text and backgrounds, and semantic colors for success/warning/error states. This generator helps you derive an entire palette from a single starting color, ensuring mathematical color harmony that you can export directly into your CSS or Tailwind configuration.