What Are Color Formats?
Colors in web design are represented in several formats. HEX is the most common CSS format — a 6-digit code like #8b5cf6. RGB expresses channels as integers 0–255. HSL (Hue, Saturation, Lightness) is the most designer-friendly — adjusting lightness changes brightness without affecting hue. HSV maps directly to the visual picker canvas. CMYK is the standard for print design.
Color Harmonies Explained
| Harmony | Definition | Best for |
|---|---|---|
| Complementary | Two colors opposite on the color wheel (180°) | High contrast, vibrant designs |
| Analogous | Three adjacent colors (±30°) | Calm, harmonious designs |
| Triadic | Three evenly spaced colors (120°) | Vibrant yet balanced palettes |
| Tetradic | Four colors at 90° intervals | Rich, complex palettes |
| Split-Complementary | Base + two adjacent to its complement | High contrast with less tension |
| Monochromatic | Multiple shades/tints of one hue | Elegant, cohesive UI design |
WCAG Contrast Requirements
WCAG AA requires a contrast ratio of at least 4.5:1 for normal text and 3:1 for large text. WCAG AAA requires 7:1 for normal text and 4.5:1 for large text. Use the Contrast Checker tab above to verify any foreground/background color combination.