Color Palette Generator

Complementary, analogous, triadic, tetradic, split-complementary, and other color theory-based schemes.

Yes, copy HEX/RGB codes for each color or download the palette as an image.

Three or four visible colors are usually enough. The familiar 60-30-10 rule assigns 60% of the surface to a background tone, 30% to a secondary and 10% to an accent — and the narrower that accent, the more clearly buttons and links stand out. Add a dark gray for body text and a light gray for borders and most screens are complete. Past five colors, people struggle to tell which element matters.

Start from that color and build an analogous set: hues within about 30 degrees on either side of it sit together without clashing, which suits backgrounds and secondary elements. For the button that must be noticed, borrow a small amount of the complementary hue from the opposite side of the wheel and the eye goes straight there. If dark mode is in scope, prepare variants that keep the same hue but drop saturation and raise lightness.