#EDEEF0
#C9CCD1
#1D4ED8
#0B1220
#E6E6E6Ice
#C4C8CCLavender Gray
#0088C2Steel Blue
#03081AObsidian
Calm Steel Blue & Obsidian is a neutral-based color palette tagged minimal, gray, blue. Steel Blue is the only saturated color here, so it does all the talking against a neutral base. Neither washed out nor loud, it adapts to most contexts. The overall temperature is cool.
Color codes click any value to copy
| Swatch | Name | HEX | RGB | HSL | OKLCH |
|---|---|---|---|---|---|
| Ice | #E6E6E6 | rgb(230, 230, 230) | hsl(0, 0%, 90%) | oklch(92.5% 0.000 0) | |
| Lavender Gray | #C4C8CC | rgb(196, 200, 204) | hsl(210, 7%, 78%) | oklch(83.1% 0.007 248) | |
| Steel Blue | #0088C2 | rgb(0, 136, 194) | hsl(198, 100%, 38%) | oklch(59.4% 0.130 237) | |
| Obsidian | #03081A | rgb(3, 8, 26) | hsl(227, 79%, 6%) | oklch(14.1% 0.041 265) |
Why it works and how to use it
The palette holds together thanks to its neutral backbone and a strong light-to-dark ladder (90% down to 6% lightness). A natural fit for websites, presentations and branding.
- Background: Ice (#E6E6E6) is the lightest color, so it belongs on large surfaces.
- Text: Obsidian (#03081A) on #E6E6E6 gives 15.97:1, passing WCAG AAA.
- Primary: Steel Blue (#0088C2) is the most saturated mid-tone; use it for buttons and links (3.17:1 against the background, fine for UI elements).
- Accent: Lavender Gray (#C4C8CC) for highlights, badges and hover states.
3 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Ice on Obsidian at 15.97:1.
Preview on a real UI see how the palette feels in context
BrandFeaturesPricingBlogGet started
Design faster with Calm Steel Blue & Obsidian
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
#E6E6E6
#C4C8CC
#0088C2
#03081A
Color-blind check: all four colors stay distinguishable under protanopia, deuteranopia and tritanopia.
Contrast check WCAG ratios between palette colors
| Pair | Sample | Ratio | Level |
|---|---|---|---|
#E6E6E6 on #03081A | Aa | 15.97:1 | AAA |
#C4C8CC on #03081A | Aa | 11.85:1 | AAA |
#0088C2 on #03081A | Aa | 5.03:1 | AA |
#E6E6E6 on #0088C2 | Aa | 3.17:1 | AA large only |
#C4C8CC on #0088C2 | Aa | 2.35:1 | Fail |
#E6E6E6 on #C4C8CC | Aa | 1.35:1 | Fail |
Similar palettes 24 more in this mood
#E1E0DF
#2D67EC
#756D5D
#0D0C0A
#151821
#455DFF
#B2BACE
#E8EBF1
#E8E3DC
#0092BE
#716757
#140E05
#050505
#373737
#007F9E
#FDFDFD
#151515
#4E4E4E
#577AFF
#FAFAFA
#121214
#5D6064
#B3CCFF
#E6EEFF
#D1D2D4
#B0B3B8
#0C37C1
#01030D
#050505
#373737
#3D5AFE
#FFFFFF
#FDFDFD
#737373
#1800A7
#050505
#141210
#4D4742
#329BD4
#F2EAE2
#EDEEF0
#C9CCD1
#006699
#05141E
#131822
#494F5B
#6C74BE
#F9FAFB
#0B0F0E
#3A4642
#BEF62F
#F3FFE0
#0A0A0A
#353A40
#7FC8F8
#F5FAFF
#F7FAFF
#707C93
#3D31BA
#171819
#000000
#3A3A3A
#D4AF37
#F2F2F2
#0A0A0A
#3D3D3D
#CCFF00
#FFFFFF
#111111
#424242
#FF3B3B
#FAFAFA
#0B0F14
#3C4552
#2EE6A6
#E6EDF3
#1A1A1D
#4C4C54
#E8788A
#F4F4F6
#111318
#454A54
#F4A7B9
#FBFBFC
#0F1419
#3E4C59
#D9B99B
#F3EFE9
#18191A
#4F5052
#B8F53F
#F7F7F5