Plum and Mustard
Why they work: a 70s-inspired pairing: deep purple against golden mustard.
Combination sets
The classic split
Plum and Mustard with a light tint of plum, a deep shade of mustard and white for breathing room.
Dark mode
Both anchors survive on dark: Mustard as the highlight, Plum as the accent, and two intermediate surfaces for elevation.
Soft & light
Both anchors reduced to tints for airy sections, with the full-strength colors kept for buttons and links.
60 / 30 / 10 UI set
A practical interface split: neutral ~60%, plum ~30% for structure, mustard ~10% for calls to action.
Gradient bridge
The direct perceptual path from plum to mustard — use for hero sections, charts and progress states.
Contrast data
| Foreground | Background | Ratio | AA | AAA |
|---|---|---|---|---|
| #DDA0DD | #DBB42C | 1.04:1 | ✗ | ✗ |
| #DBB42C | #DDA0DD | 1.04:1 | ✗ | ✗ |
| #DDA0DD | #FFFFFF | 2.07:1 | ✗ | ✗ |
| #DDA0DD | #000000 | 10.15:1 | ✓ | ✓ |
| #DBB42C | #FFFFFF | 1.99:1 | ✗ | ✗ |
| #DBB42C | #000000 | 10.58:1 | ✓ | ✓ |
| #16161D | #FF9889 | 8.66:1 | ✓ | ✓ |
Related combinations
FAQ
Do plum and mustard go together?
Yes — a 70s-inspired pairing: deep purple against golden mustard. Their hues are 107° apart on the color wheel and the direct pair contrast is 1.04:1. The sets on this page show exactly how to balance them (warm + cool).
What text color works on plum and mustard?
On plum use #000000 text (10.15:1); on mustard use #000000 (10.58:1). Both pass WCAG AA for normal text.
What are the exact color codes?
Plum: #DDA0DD — OKLCH oklch(78.33% 0.108 326.5). Mustard: #DBB42C — OKLCH oklch(78.29% 0.149 91.6).