I am not new to UI design, but I have absolutely no experience with color schemes.

Say I choose rgb(35, 51, 72) as the base and background color. This is #233348 and hsl(214, 35%, 21%). Are there methods of calculating a red, green, and blue that go with that base color?

Take https://demo.vaadin.com/lumo-editor/ for example. There are a few dark presets available. Is it possible that every color is derived from the base color? If so, how? I guess my question is, how does one derive all of the color choices on that page from the base color?

  • 1
    Does this answer your question? Choosing a set of colors – Nash Jan 24 at 12:06
  • 1
    Hi Oliver, there is no easy or scientific way to do that. Have a look at this answer which lists a lot of useful resources and tools. – Nash Jan 24 at 12:07
  • I’m voting to close this question because it is not a User Experience question, it is a Graphic Design one. – JonW Jan 25 at 14:51

A very easy way is changing the hue variable of the base color while keeping the saturation and brightness intact. The hue variable ranges from 0º to 360º, that is, the entire color wheel. At the question the hue is at 214º. Pure red is at 360º or 0º and green at ≈112º.

enter image description here

enter image description here

But color is not mathematics, finding the color that goes with a certain one is not a direct formula, other factors such as type of contrast, use, receiver, product... are missing. All this makes the question seem incomplete: the knowledge of color theory and perception has a greater impact on the selection of a color. In fact, the result changing the base color hue to green and red does not offer any contrast, something not contemplated in the question.

Not the answer you're looking for? Browse other questions tagged or ask your own question.