Yellow is where paint and light disagree most. In paint, yellow is one of the painter's wheel corners, and in our paint model no pair of the other paints gets back to it. In light, yellow is not one of the lamps at all: red and green light together make it.
Both answers are right. They describe two different ways of making color.
CSS yellow is the full red and green lamps of a screen together. Paint yellows are a little less bright.
In paint
Without our yellow tube, the nearest mixes in our paint model come out as pale creams or dull ochres, well away from a clean yellow. The table shows exactly how far.
Closest two-paint mixes
- += 30% Orange + 70% White #F7D98D · ΔE 17.1 from yellow
- += 30% Green + 70% White #ADE1B7 · ΔE 27.3 from yellow
- += 85% Orange + 15% Cyan #AC9128 · ΔE 28.3 from yellow
- += 75% Orange + 25% Green #AC8F28 · ΔE 29.0 from yellow
- += 90% White + 10% Black #EFEFEC · ΔE 29.7 from yellow
Equal parts
- += Orange + White #F7B852 · ΔE 23.9 from yellow
- += Green + Orange #648C32 · ΔE 35.6 from yellow
ΔE is the CIEDE2000 color difference between the mix and yellow. Zero means the same color; the smaller the number, the closer the mix.
In light
Turn the red and green lamps of a screen fully on with the blue lamp off, and you get yellow. This is how every phone and monitor shows yellow.
The three lamps at these levels give #FFFF00. Levels are the amount of light each lamp gives out, which is not the same scale as the 0–255 numbers in a color code; the method page shows the conversion.
Wheel pairings
Violet sits opposite yellow on the painter's wheel.
| Rule | Painter's wheel | OKLCH wheel |
|---|---|---|
| Complementary +180° | #AA00FF 4.71:1 | #F3F1FF 1.04:1 |
| Analogous -30° +30° | #FFBF00 1.54:1#80FF00 1.21:1 | #FFF0C1 1.06:1#D0FFC3 1.04:1 |
| Triadic +120° +240° | #0000FF 8.00:1#FF0000 3.72:1 | #D6FBFF 1.02:1#FFE9F9 1.07:1 |
| Split-complementary +150° +210° | #5500FF 6.91:1#FF00AA 3.35:1 | #E7F6FF 1.03:1#FFE9FF 1.07:1 |
Yellow mixed with each paint
Start from yellow (#FFFF00) and add one of our ten stand-in paints. Shares are by amount, in our paint model.
| Add | 75% yellow + 25% | 50% yellow + 50% | 25% yellow + 75% |
|---|---|---|---|
| Red | #FFB32D | #F5682E | #DD332B |
| Yellow | #FDF511 | #FBE518 | #F9DA1B |
| Blue | #BFE132 | #6EAE47 | #1E6D55 |
| Orange | #FDE31D | #F9B91E | #F4961D |
| Green | #BCEB28 | #72C536 | #3C973B |
| Violet | #E6D731 | #BD9B44 | #7D574F |
| Magenta | #FFB538 | #EE6C43 | #D0394F |
| Cyan | #95EE2E | #3ECD46 | #00AB6B |
| White | #FCFE16 | #F7FC41 | #F2FA87 |
| Black | #DADF2B | #A2A938 | #555933 |
Named yellows in CSS
| CSS name | Swatch | Code | ΔE from this page's yellow |
|---|---|---|---|
| yellow | #FFFF00 | 0.0 | |
| gold | #FFD700 | 11.6 | |
| khaki | #F0E68C | 12.8 |
Paint results come from a pigment model and our ten stand-in paints, not from real tubes, which vary by brand and pigment. Try any pair in the color mixer, or read how each swatch is worked out.