0

I don't understand:

  • Using Adobe color wheel, the complementary of yellow (#ffff00) is purple (#7D00FF).
  • Using Material Design, the complementary is blue(#0000ff).

I understood that it depended on the color model used (RYB or RGB), but I read articles which say that we rather use the RGB wheel for digital interfaces, but later in the same article, the complementary colors by showing an RYB wheel and therefore purple as complementary.

Then I don't understand, which model to use, and what is complementary of yellow to use in design, purple or blue, Adobe color wheel model or Material Design model?

5
  • Does this answer your question? Condfused about colour theory wheel
    – Billy Kerr
    Oct 17, 2023 at 13:08
  • Digital images use RGB colour for the web and on-screen use - an additive colour system. RYB is a subtractive colour system, traditionally used by artists for mixing paint, more akin to CMYK that is used in printing.
    – Billy Kerr
    Oct 17, 2023 at 13:12
  • Note, if by complimentary you mean exactly the opposite of RGB yellow #ffff00, then it's #0000ff - basically 100% blue. Adobe's on line colour wheel uses some other method of calculating complimentary colours. As to which, I'm not sure they share that information.
    – Billy Kerr
    Oct 17, 2023 at 13:19
  • "which model to use" - use one that works for your purposes. "what is complementary of yellow" - one that visually pairs well for your needs Oct 17, 2023 at 18:02

2 Answers 2

0

On the site, there are some posts regarding color wheels and Adobe's mystery wheel. I added some at the bottom of this post.

But let me try to unpack your specific question.

I don't understand: using Adobe color wheel, the complementary of yellow (#ffff00) is purple (#7D00FF). Using Material Design, the complementary is blue (#0000ff).

Some of the links below show that we do not understand Adobe color wheel either. n_n

Material design complementary is clearly a mathematical complementary. This means that if you add the numbers (add as 1+1=2) you get white.

This, and the variant rgb(255,255,0) or hsl(180,100,50) notations are better if you automate things, and you will find consistency between those calculations and hexadecimal notation.

The hsl notation (using an hsl color model) has very "clear" complementary colors. Just add 180° to the hue. But this in reality does not tell you which color you will get. It is dependent on the assumption that it will use pure red as 0°, and not-any-red as 180°, but also full 255 of blue and 255 of green. This is why it is consistent with RGB. It depends on it.

I understood that it depended on the color model used (RYB or RGB),

RYB model, as you will read on some of the posts, is targeted at a more artistic and traditional approach, back then when where it was more about how it looks rather than abstracting it to numbers.

I agree that using purple as the opposite of yellow is more pleasing than using blue, and this is also used in the movies and posters if you google "orange and teal".

but I read articles which say that we rather use the RGB wheel for digital interfaces, but later in the same article, the complementary colors by showing an RYB wheel and therefore purple as complementary.

It is difficult without knowing the specific article you have read, but again, if you want to make operations on colors to detect the exact opposite, you use mathematical models. RGB, Hsl. All are based on RyGcBm color wheels.

But using some other models can give you ideas on what looks, (in theory), more pleasing.

To confuse you more n_n here is a list of more websites you can use: Is there a good resource or tool to help build a palette/color scheme around colors I select?

But my favorite of those, if we are thinking about a "methodical" approach is paletton.com which uses an RYB wheel.

Then I don't understand, which model to use, and what is complementary of yellow to use in design, purple or blue, Adobe color wheel model or Material Design model?

Use whatever you need. It is about how it looks. How do you feel about it.

Yes, you could be worried about passing a "contrast" checker or something like that. But in theory, UX and UI are meant to make the experience as pleasant as you can.

The tools to make palettes are meant to give you "freedom" give you ideas, not to "constrain you" by forcing you to use a model.


About the specific opposite color on RGB or Hexadecimal How to make a given color a bit darker or lighter?

A general search: https://graphicdesign.stackexchange.com/search?q=color+wheel

Confused about color theory/wheel?

Is there a name/formulae for the hue-circle scaling Adobe is using with "Kuler"

Is there a standard for color wheels?

0

Color theory is sometimes a bit hard to wrap head around because it talks about different things at different time as there are in fact many color theories. It is also not a hard science theory but rather a relative thing.

Anyway, its rather impossible to construct a color wheel that everybody is satisfied with. The color wheel is primarily used for two different tasks but there are others:

  1. color utilisation. To understand mixing and maximizing of the available visual impact with your imperfect colors.

  2. For color compliment picking.

So for compliment picking its clear that red-green and blue-yellow are the antagonist pairs. We can see that by examining the eyes structure. But this is about as far as hard science takes this discussion.*

Neither RYB or RGB wheels are wrong. Because there is no such metric. They just use same logic with different mixing rules to end up in a different place. The people making the wheel are usually concerned with color utilisation not compliment picking.

This said, there is some indication that there might be some sort scientific resolution to this problem coming. Theres been some small andvances in some of the really unsatisfactory parts about working with color interpolation. But we dont know the answer yet.

* Common everyday meaning of words also start to fail us when trying to discuss this.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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