Olive, olive drab or dark olive green?
CSS has three olive keywords, and they behave like a little family. Plain olive is equal red and green with no blue, so its hue is 60°, the same as yellow. That is why it can look more mustard than green on some screens. The other two shift towards green.
| Name | HEX | Hue | White text |
|---|---|---|---|
| olive | #808000 | 60° | 4.20:1, large text only |
| olivedrab | #6B8E23 | 80° | 3.81:1, large text only |
| darkolivegreen | #556B2F | 82° | 5.95:1, passes AA |
For “olive green” as most people picture it (army jackets, olive trousers) dark olive green is often the better match. The community colour-name list has an “Olive Drab” of #6F7632, which is greyer than the CSS version.
Olive vs khaki
Khaki (from a Hindustani word for dusty) is olive's lighter, sandier cousin. CSS khaki is #F0E68C, a pale yellow that surprises people expecting trouser khaki; darkkhaki (#BDB76B) and the name list's Khaki (#C3B091) are closer to the fabric. Rule of thumb: if it is dark and green, it is olive; if it is light and beige, it is khaki.
Colours that go with olive
Olive is an earth tone, so it likes other earth tones: cream, rust and mustard give an autumn palette. In clothing, olive with navy or white is a common, safe combination. Olive text on cream scores 4.06:1, fine for headings but slightly weak for body text; olive text on beige drops to 3.79:1.
Questions
What is the RGB code for olive green?
CSS olive is rgb(128, 128, 0). Dark olive green is rgb(85, 107, 47).
Does olive go with sage?
Yes, as long as one is clearly lighter. See sage green for how the two differ.