#2C3E50
#7F8C8D
#BDC3C7
#ECF0F1
#405365Graphite
#99A7A8Dusty Blue
#D6DCE0Fog
#F7FBFCSnow
Graphite & Dusty Blue Haze is a neutral-based color palette tagged winter, minimal, gray. Snow 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 |
|---|---|---|---|---|---|
| Graphite | #405365 | rgb(64, 83, 101) | hsl(209, 22%, 32%) | oklch(43.4% 0.038 247) | |
| Dusty Blue | #99A7A8 | rgb(153, 167, 168) | hsl(184, 8%, 63%) | oklch(71.8% 0.016 202) | |
| Fog | #D6DCE0 | rgb(214, 220, 224) | hsl(204, 14%, 86%) | oklch(89.1% 0.009 237) | |
| Snow | #F7FBFC | rgb(247, 251, 252) | hsl(192, 45%, 98%) | oklch(98.5% 0.004 214) |
Why it works and how to use it
Two of the four colors are near-neutral, which leaves room for Fog to lead. Lightness runs from 32% to 98%. Well suited to websites, presentations and branding.
- Background: Snow (#F7FBFC) is the lightest color, so it belongs on large surfaces.
- Text: Graphite (#405365) on #F7FBFC gives 7.63:1, passing WCAG AAA.
- Primary: Fog (#D6DCE0) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
- Accent: Dusty Blue (#99A7A8) for highlights, badges and hover states.
2 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Graphite on Snow at 7.63:1.
Preview on a real UI see how the palette feels in context
BrandFeaturesPricingBlogGet started
Design faster with Graphite & Dusty Blue Haze
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
#405365
#99A7A8
#D6DCE0
#F7FBFC
Color-blind check: all four colors stay distinguishable under protanopia, deuteranopia and tritanopia.
Contrast check WCAG ratios between palette colors
| Pair | Sample | Ratio | Level |
|---|---|---|---|
#405365 on #F7FBFC | Aa | 7.63:1 | AAA |
#405365 on #D6DCE0 | Aa | 5.74:1 | AA |
#405365 on #99A7A8 | Aa | 3.2:1 | AA large only |
#99A7A8 on #F7FBFC | Aa | 2.39:1 | Fail |
#99A7A8 on #D6DCE0 | Aa | 1.8:1 | Fail |
#D6DCE0 on #F7FBFC | Aa | 1.33:1 | Fail |
Similar palettes 24 more in this mood
#FDF7ED
#C61C26
#E5D3BA
#313235
#444444
#876857
#E15848
#FEF9F4
#2B2B2B
#6B4E3D
#C0392B
#F4EFEA
#F2F4F5
#C9CED3
#8A949B
#3B4247
#F8FAFB
#DDE2E8
#A6B0B7
#4B5257
#1E3A2F
#3E6B55
#DCE7E1
#FBFCFB
#3B3F47
#8C93A0
#D5DAE3
#F7F8FA
#6B7B8C
#98A6B5
#C8D1DA
#EEF2F5
#F7FBFF
#D7E6F2
#7FA7C9
#243B53
#663537
#955558
#E2DAD5
#F5F2F1
#5A5A5A
#98857A
#DF8C7F
#F1EEEB
#1B4965
#5FA8D3
#A8E0DE
#E4F1FF
#D1DBF0
#7B9CA4
#7B71A9
#507C99
#13505B
#0C7489
#8FD3E0
#F0FAFB
#574276
#595D6D
#9E819B
#EBA3B8
#8FCD9A
#D32636
#FBBFCC
#FDF9F3
#F4EFE7
#F0BAC5
#EE353E
#91C58A
#425355
#588DAD
#9081B1
#A8AEBB
#466947
#7E8D97
#73B9C2
#BAD2CB
#4B615B
#87A489
#91ADC0
#DEF1F4
#FCD1E4
#F4EEE3
#83DEB0
#F5A69F
#F7F5F1
#D01C35
#3C7E42
#BFE5F9
#D12935
#3C8253
#B1DDF4
#F3EFEA