#0F5C63
#2A8A8C
#9FD3CF
#F2F1EA
#004D40Evergreen
#A65B71Clay
#4DB6ACCadet
#B2DFDBPowder Blue
Crisp Clay & Cadet is a complementary color palette tagged modern, teal. Near-complementary hues (about 172° 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 |
|---|---|---|---|---|---|
| Evergreen | #004D40 | rgb(0, 77, 64) | hsl(170, 100%, 15%) | oklch(37.6% 0.070 176) | |
| Clay | #A65B71 | rgb(166, 91, 113) | hsl(342, 30%, 50%) | oklch(56.5% 0.101 2) | |
| Cadet | #4DB6AC | rgb(77, 182, 172) | hsl(174, 42%, 51%) | oklch(71.2% 0.098 187) | |
| Powder Blue | #B2DFDB | rgb(178, 223, 219) | hsl(175, 41%, 79%) | oklch(87.1% 0.047 190) |
Why it works and how to use it
It works because the lightness range is wide (15% to 79%), which gives clear hierarchy between background, content and accents. Try it for websites, presentations and branding.
- Background: Powder Blue (#B2DFDB) is the lightest color, so it belongs on large surfaces.
- Text: Evergreen (#004D40) on #B2DFDB gives 6.78:1, passing WCAG AA.
- Primary: Cadet (#4DB6AC) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
- Accent: Clay (#A65B71) for highlights, badges and hover states.
1 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Evergreen on Powder Blue at 6.78:1.
Preview on a real UI see how the palette feels in context
BrandFeaturesPricingBlogGet started
Design faster with Crisp Clay & Cadet
A palette preview that turns four colors into a page, so you can judge hierarchy, contrast and mood before you commit.
Primary action SecondaryCard title
Card title
Card title
Roles are assigned by lightness.
Color blindness simulation
#004D40
#A65B71
#4DB6AC
#B2DFDB
Color-blind check: all four colors stay distinguishable under protanopia, deuteranopia and tritanopia.
Contrast check WCAG ratios between palette colors
| Pair | Sample | Ratio | Level |
|---|---|---|---|
#004D40 on #B2DFDB | Aa | 6.78:1 | AA |
#004D40 on #4DB6AC | Aa | 4.03:1 | AA large only |
#A65B71 on #B2DFDB | Aa | 3.32:1 | AA large only |
#004D40 on #A65B71 | Aa | 2.04:1 | Fail |
#A65B71 on #4DB6AC | Aa | 1.97:1 | Fail |
#4DB6AC on #B2DFDB | Aa | 1.68:1 | Fail |
Similar palettes 24 more in this mood
#222831
#575D65
#00ADB5
#EEEEEE
#8A6800
#84A347
#00C38B
#56E7F4
#A630C1
#755EF5
#7ABCFF
#80E6FF
#00818A
#009D8C
#31CA88
#ACE496
#3A4750
#6E7F8A
#B8C4CB
#3CFFEA
#ECE7E4
#00A0AE
#5F4F44
#302823
#005A62
#6BADA6
#D9E2E5
#C67B5F
#00736B
#20A8BE
#66B6E9
#ABC7FF
#ACB100
#FFB347
#0A9396
#F8F8F8
#00616A
#4DA27C
#98AA55
#FFCA7B
#6B4E1E
#00B8C4
#E8DCC0
#F7F3EA
#498711
#00AA6D
#00C0AE
#00DDF3
#D2A04B
#757168
#5DF0DD
#F3FBFF
#A07200
#59964F
#8E9100
#44E9BE
#EDC27E
#B1C06C
#4A8E67
#006364
#00735C
#379879
#7DC5A6
#81E3CC
#FF8266
#271800
#00B1A4
#C5C5C9
#1B6F73
#47B377
#F2CC8F
#F4F1DE
#E2D900
#6EB659
#00A381
#006C74
#2B2B2B
#4A4A4A
#00E9DB
#F5F5F5
#B6CCFF
#62B0FF
#00A0DD
#00657B
#318994
#A2E5DE
#F3FCFF
#FFB092
#004643
#ABD1C6
#E8E4E6
#3EE2E3