#D1DBF0
#7B9CA4
#7B71A9
#507C99
#425355Graphite
#588DADSteel Blue
#9081B1Slate
#A8AEBBHeather
Snowy Steel Blue & Slate is a muted analogous color palette tagged winter, muted, cold. Analogous neighbors on the wheel (Steel Blue, Slate) give it a natural, low-tension flow. Saturation stays low across the board, giving it a calm, editorial feel. The overall temperature is cool.
Color codes click any value to copy
| Swatch | Name | HEX | RGB | HSL | OKLCH |
|---|---|---|---|---|---|
| Graphite | #425355 | rgb(66, 83, 85) | hsl(186, 13%, 30%) | oklch(42.9% 0.021 205) | |
| Steel Blue | #588DAD | rgb(88, 141, 173) | hsl(203, 34%, 51%) | oklch(61.9% 0.074 236) | |
| Slate | #9081B1 | rgb(144, 129, 177) | hsl(259, 24%, 60%) | oklch(63.4% 0.073 299) | |
| Heather | #A8AEBB | rgb(168, 174, 187) | hsl(221, 12%, 70%) | oklch(75.0% 0.020 266) |
Why it works and how to use it
Two of the four colors are near-neutral, which leaves room for Steel Blue to lead. Lightness runs from 30% to 70%. Well suited to websites, presentations and branding.
- Background: Heather (#A8AEBB) is the lightest color, so it belongs on large surfaces.
- Text: Graphite (#425355) on #A8AEBB gives 3.63:1, enough for large headings only.
- Primary: Steel Blue (#588DAD) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
- Accent: Slate (#9081B1) for highlights, badges and hover states.
No pair inside the palette reaches 4.5:1, so add black or white for body text.
Preview on a real UI see how the palette feels in context
BrandFeaturesPricingBlogGet started
Design faster with Snowy Steel Blue & 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
#425355
#588DAD
#9081B1
#A8AEBB
Color-blind check: all four colors stay distinguishable under protanopia, deuteranopia and tritanopia.
Contrast check WCAG ratios between palette colors
| Pair | Sample | Ratio | Level |
|---|---|---|---|
#425355 on #A8AEBB | Aa | 3.63:1 | AA large only |
#425355 on #9081B1 | Aa | 2.29:1 | Fail |
#425355 on #588DAD | Aa | 2.24:1 | Fail |
#588DAD on #A8AEBB | Aa | 1.62:1 | Fail |
#9081B1 on #A8AEBB | Aa | 1.58:1 | Fail |
#588DAD on #9081B1 | Aa | 1.02:1 | Fail |
Similar palettes 24 more in this mood
#574276
#595D6D
#9E819B
#EBA3B8
#436291
#6B88B0
#7CA5D5
#C3D8FF
#878DBE
#CBB8C4
#DEC3F6
#FFDBE0
#416E90
#6194C0
#9CBCD9
#96D7FF
#005359
#529D9F
#8ACBCC
#8DE4F3
#466947
#7E8D97
#73B9C2
#BAD2CB
#77DADA
#7EB3A3
#41674C
#37565E
#00727A
#667248
#869387
#68B4A1
#1B4965
#5FA8D3
#A8E0DE
#E4F1FF
#13505B
#0C7489
#8FD3E0
#F0FAFB
#F7FBFF
#D7E6F2
#7FA7C9
#243B53
#4B615B
#87A489
#91ADC0
#DEF1F4
#663537
#955558
#E2DAD5
#F5F2F1
#315E7B
#79C2EE
#BFF7F5
#F6FBFF
#EAF4FB
#BFDCF0
#5C93C4
#1F3F5F
#2D6671
#368FA5
#A8EDFA
#F2FCFD
#2C3E50
#7F8C8D
#BDC3C7
#ECF0F1
#1E3A2F
#3E6B55
#DCE7E1
#FBFCFB
#6B7B8C
#98A6B5
#C8D1DA
#EEF2F5
#FDF7ED
#C61C26
#E5D3BA
#313235
#444444
#876857
#E15848
#FEF9F4
#2B2B2B
#6B4E3D
#C0392B
#F4EFEA
#F2F4F5
#C9CED3
#8A949B
#3B4247