Pick a color, choose a scheme, get a full palette with shades.
A well-chosen color palette is the foundation of any good visual design. Whether you're building a website, designing a logo, creating a presentation or developing a brand identity, understanding color relationships helps you make choices that look intentional and harmonious.
Monochromatic: uses a single hue in varying shades and tints. Creates a clean, sophisticated look — great for minimalist designs. Complementary: uses two colors directly opposite each other on the color wheel (e.g., blue and orange). High contrast and vibrant — good for call-to-action elements. Analogous: uses three adjacent colors on the wheel. Harmonious and natural-looking — common in nature-inspired designs. Triadic: three colors equally spaced at 120° intervals. Balanced and vibrant. Tetradic: four colors forming a rectangle on the wheel. Rich and complex — requires careful balance. Split Complementary: a base color plus the two colors adjacent to its complement. High contrast but less tension than straight complementary.
Use the Export section to copy your palette as CSS custom properties (ready to paste into a stylesheet), as a Tailwind config object (paste into your tailwind.config.js), or as a plain HEX list for use in any design tool. Click any color swatch to copy its HEX code directly.