#006D77
#83C5BE
#EDF6F9
#FFDDD2
#64557CDusk
#8B83A7Slate
#C4BCCFLavender Gray
#F2EFF5Frost
Polar Dusk & Slate is a muted neutral-based color palette tagged cold, muted, gray. Frost is the only saturated color here, so it does all the talking against a neutral base. Every color is softened, so it works well as a background system for text-heavy layouts. The overall temperature is cool.
Color codes click any value to copy
| Swatch | Name | HEX | RGB | HSL | OKLCH |
|---|---|---|---|---|---|
| Dusk | #64557C | rgb(100, 85, 124) | hsl(263, 19%, 41%) | oklch(48.0% 0.064 302) | |
| Slate | #8B83A7 | rgb(139, 131, 167) | hsl(253, 17%, 58%) | oklch(63.0% 0.054 295) | |
| Lavender Gray | #C4BCCF | rgb(196, 188, 207) | hsl(265, 17%, 77%) | oklch(80.8% 0.028 305) | |
| Frost | #F2EFF5 | rgb(242, 239, 245) | hsl(270, 23%, 95%) | oklch(95.6% 0.009 308) |
Why it works and how to use it
It works because the lightness range is wide (41% to 95%), which gives clear hierarchy between background, content and accents. Try it for websites, presentations and branding.
- Background: Frost (#F2EFF5) is the lightest color, so it belongs on large surfaces.
- Text: Dusk (#64557C) on #F2EFF5 gives 5.89:1, passing WCAG AA.
- Primary: Slate (#8B83A7) is the most saturated mid-tone; use it for buttons and links (3.12:1 against the background, fine for UI elements).
- Accent: Lavender Gray (#C4BCCF) for highlights, badges and hover states.
1 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Dusk on Frost at 5.89:1.
Preview on a real UI see how the palette feels in context
BrandFeaturesPricingBlogGet started
Design faster with Polar Dusk & Slate
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
#64557C
#8B83A7
#C4BCCF
#F2EFF5
Color-blind check: all four colors stay distinguishable under protanopia, deuteranopia and tritanopia.
Contrast check WCAG ratios between palette colors
| Pair | Sample | Ratio | Level |
|---|---|---|---|
#64557C on #F2EFF5 | Aa | 5.89:1 | AA |
#64557C on #C4BCCF | Aa | 3.65:1 | AA large only |
#8B83A7 on #F2EFF5 | Aa | 3.12:1 | AA large only |
#8B83A7 on #C4BCCF | Aa | 1.94:1 | Fail |
#64557C on #8B83A7 | Aa | 1.88:1 | Fail |
#C4BCCF on #F2EFF5 | Aa | 1.61:1 | Fail |
Similar palettes 24 more in this mood
#586386
#8C97BB
#DCE1F0
#F9FAFD
#F3EDFF
#C5B4F9
#9182A3
#605C64
#404C60
#738DAB
#97C4F5
#E7F0F9
#273754
#52719E
#F1DDBE
#FDFAF5
#0F5C63
#2A8A8C
#9FD3CF
#F2F1EA
#0E3B4A
#1F7A8C
#8FD5D2
#EAF7F5
#F0F1FF
#B5B6F5
#706F96
#424149
#1F2E3E
#526A8C
#7697BD
#FAFBF7
#3F4A6B
#6F7A9C
#C6CBDA
#F3F4F7
#2F5D62
#5E8B7E
#A7C4BC
#F1F7F5
#A8DADC
#457B9D
#1D3557
#F1FAEE
#1B4965
#5FA8D3
#A8E0DE
#E4F1FF
#1B4332
#2D6A4F
#B7B7A4
#F0EFEB
#1C2541
#465D79
#5BC0BE
#FFFFFF
#EEF9F7
#BCE7E0
#85CFC5
#2F5F5A
#688E79
#83B9C6
#B7D3A5
#D0D1D0
#3D405B
#81B29A
#96DEFF
#F4F1DE
#DFB8FA
#B1E7E9
#AEBEE7
#FDFDFD
#D1DBF0
#7B9CA4
#7B71A9
#507C99
#18213B
#526195
#7393C1
#ECFFFB
#ECFFFE
#81FEF1
#87C8BE
#89978D
#13505B
#0C7489
#8FD3E0
#F0FAFB
#3D3B6B
#6D6CA6
#B9B8E3
#F2F1FB