Analogous
Monochromatic
Triadic
Complementary
Split Complementary
Double Split Complementary
Square
Compound
Shades
How Does it Work?
Generate 9 different color palettes for every possible color scheme in 4 simple steps.
Select your main color from the toolbar or randomize using the "Randomize" button / Spacebar.
Get 9 different palettes matching each color scheme.
Fiddle with the main color to find the best combinations.
Either copy the HEX code by clicking on a color, or export your colors. You can use them in the Realtime Colors UI color palette tool to make a final decision.
FAQ
Answers to some questions you might have.
What is this tool exactly?
This tool takes one main color and applies it on 9 different color schemes. In each palette, you can find colors matching perfectly with the main color.
What can I do with the colors generated?
Well, for starters, you could just export it and receive 9 beautiful color palettes in .png, and a .txt file with your selected palettes in HEX values. But if you're thinking 'what's next', you can always experiment with these colors inside the Realtime Colors tool and check how they would look like on a real website.
What will I receive after exporting my colors?
After exporting, you will receive a .zip file. This file is compressed, so you will have to extract it.
After extracting it, you will see 9 different .png files and a .txt file. The .png images shows your color palettes in squares next to each other. The .txt file includes the color codes in HEX. You can send these files to designers or developers, or just use them in your project.
Are these colors all suitable for one website/project?
Yes and no. These colors are just meant to be inspirations for your big ideas. Don't just limit yourself to one color scheme. Make your designs fun and vibrant. You can use these colors as an inspiration for adding visual hierarchy to your website. You might need to modify a thing or two or skip a color, but still, it can turn out great.
Sometimes these colors might all go very well together on a single webpage without any modifications. But you should only consider that as a happy accident. :)
What do the terms on the palette mean?
The terms monochromatic, complementary, analogous, triadic, split complementary, double split complementary, square, compound, and shades are color schemes for design. Each of them refers to a type of color combination. Here are the full definitions:
Monochromatic means the colors originate from the same hue, except they are different tints and shades of that hue.
Complementary means the colors are the opposite of each other's hues.
Triadic is similar to complementary, except considering 2 opposites for a color instead of one.
Analogous refers to colors that are adjacent/close to each other.
Square refers to schemes in which there is one main color and some other colors on the color wheel 90deg apart from each other.
Compound means the scheme selects one main color and two adjacent colors next to its complementary color.
Split complementary and double-split complementary each take two/four colors around the main color that would correspond to the opposite side of each other.
In this tool, you can see all 4 of them being suggested along the main color to make a collection of colors that would go well with the selected color.
Your Journey Shouldn't End Here.
Follow me on social media to stay tuned on more projects.
Stay TunedTip: Press the Spacebar to randomize faster!