Crimson Amethyst & Brass is a complementary color palette tagged modern, white, purple. Near-complementary hues (about 133° apart) make this a high-contrast, attention-grabbing combination. Saturation is moderate, which keeps it flexible for both interfaces and print. Warm and cool hues are mixed, which adds depth.
Color codes click any value to copy
| Swatch | Name | HEX | RGB | HSL | OKLCH |
|---|---|---|---|---|---|
| Taupe | #403B16 | rgb(64, 59, 22) | hsl(53, 49%, 17%) | oklch(34.8% 0.055 102) | |
| Brass | #B3A140 | rgb(179, 161, 64) | hsl(51, 47%, 48%) | oklch(70.6% 0.118 99) | |
| Frost | #E9F5F0 | rgb(233, 245, 240) | hsl(155, 38%, 94%) | oklch(96.0% 0.014 169) | |
| Amethyst | #953DC2 | rgb(149, 61, 194) | hsl(280, 52%, 50%) | oklch(54.0% 0.204 312) |
Why it works and how to use it
It works because the lightness range is wide (17% to 94%), which gives clear hierarchy between background, content and accents. Try it for websites, presentations and branding.
- Background: Frost (#E9F5F0) is the lightest color, so it belongs on large surfaces.
- Text: Taupe (#403B16) on #E9F5F0 gives 10.13:1, passing WCAG AAA.
- Primary: Amethyst (#953DC2) is the most saturated mid-tone; use it for buttons and links (5.04:1 against the background, fine for UI elements).
- Accent: Brass (#B3A140) for highlights, badges and hover states.
2 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Taupe on Frost at 10.13:1.
Preview on a real UI see how the palette feels in context
Design faster with Crimson Amethyst & Brass
A palette preview that turns four colors into a page, so you can judge hierarchy, contrast and mood before you commit.
Primary action SecondaryColor blindness simulation
Color-blind check: all four colors stay distinguishable under protanopia, deuteranopia and tritanopia.
Contrast check WCAG ratios between palette colors
| Pair | Sample | Ratio | Level |
|---|---|---|---|
#403B16 on #E9F5F0 | Aa | 10.13:1 | AAA |
#E9F5F0 on #953DC2 | Aa | 5.04:1 | AA |
#403B16 on #B3A140 | Aa | 4.36:1 | AA large only |
#B3A140 on #E9F5F0 | Aa | 2.32:1 | Fail |
#B3A140 on #953DC2 | Aa | 2.17:1 | Fail |
#403B16 on #953DC2 | Aa | 2.01:1 | Fail |