Base Color Palette
Build complementary, analogous, or triadic colors from a base color and copy the palette.
How to use
- Choose analogous for nearby hues, complementary for opposing hues, or triadic for three evenly spaced hues.
- Copy the generated codes into your design’s color settings.
- Use labels, headings, or line patterns alongside color when distinguishing information.
When to use this tool
Explore companion colors for buttons or charts while keeping a chosen base color. Hue rotation preserves the base saturation and lightness, making the harmony rule visible rather than selecting colors at random.
Inputs and settings
Result
Example input and actual output
- Base color: #ff0000
- Harmony: Triadic
#ff0000 #00ff00 #0000ff
A red base with triadic harmony produces red, green, and blue. These are hue-based candidates, not a guarantee of readable text or consistent print reproduction.
Scope and limitations
Colors are generated by rotating HSL hue. Check contrast separately for each intended use.
Next step and alternatives
Tint and Shade Samples — Build lighter and darker variants for backgrounds and borders.
Frequently asked questions
Why do black or white produce repeated colors?
At zero saturation, changing hue has no visible effect. Use tint and shade samples when you need lightness variations.
How far apart are analogous colors?
Analogous colors sit 30 degrees either side of the base. Complementary uses 180 degrees; triadic uses 120-degree intervals.
Does the generated palette guarantee readable text?
These are hue-based candidates, not a guarantee of readable text or consistent print reproduction. Check them for the intended use.
Related tools
Share this tool
Share only the tool name and public URL. Your input and results are not included.