#EFE0D3
#AEA397
#786C5E
#625548
#D2C4D5Thistle
#A99EB0Dusty Blue
#817386Slate
#413944Iron
Clean Slate & Dusty Blue color palette
Clean Slate & Dusty Blue is a muted neutral-based color palette tagged modern, monochrome, gray. Thistle 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.
Color codes click any value to copy
| Swatch | Name | HEX | RGB | HSL | OKLCH |
|---|---|---|---|---|---|
| Thistle | #D2C4D5 | rgb(210, 196, 213) | hsl(289, 17%, 80%) | oklch(83.7% 0.028 320) | |
| Dusty Blue | #A99EB0 | rgb(169, 158, 176) | hsl(277, 10%, 65%) | oklch(71.4% 0.029 312) | |
| Slate | #817386 | rgb(129, 115, 134) | hsl(284, 8%, 49%) | oklch(57.5% 0.033 317) | |
| Iron | #413944 | rgb(65, 57, 68) | hsl(284, 9%, 25%) | oklch(35.7% 0.022 317) |
Why it works and how to use it
Two of the four colors are near-neutral, which leaves room for Dusty Blue to lead. Lightness runs from 25% to 80%. Well suited to websites, presentations and branding.
- Background: Thistle (#D2C4D5) is the lightest color, so it belongs on large surfaces.
- Text: Iron (#413944) on #D2C4D5 gives 6.65:1, passing WCAG AA.
- Primary: Dusty Blue (#A99EB0) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
- Accent: Slate (#817386) for highlights, badges and hover states.
1 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Thistle on Iron at 6.65:1.
Preview on a real UI see how the palette feels in context
BrandFeaturesPricingBlogGet started
Design faster with Clean Slate & Dusty Blue
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
#D2C4D5
#A99EB0
#817386
#413944
Color-blind check: all four colors stay distinguishable under protanopia, deuteranopia and tritanopia.
Contrast check WCAG ratios between palette colors
| Pair | Sample | Ratio | Level |
|---|---|---|---|
#D2C4D5 on #413944 | Aa | 6.65:1 | AA |
#A99EB0 on #413944 | Aa | 4.33:1 | AA large only |
#D2C4D5 on #817386 | Aa | 2.66:1 | Fail |
#817386 on #413944 | Aa | 2.5:1 | Fail |
#A99EB0 on #817386 | Aa | 1.73:1 | Fail |
#D2C4D5 on #A99EB0 | Aa | 1.54:1 | Fail |
Similar palettes 24 more in this mood
#2B2A28
#8D8780
#D8D2C8
#F5F2ED
#463F3A
#8A817C
#BCB8B1
#F4F3EE
#0A1A1E
#648691
#EED200
#D8E2E5
#DDDEE2
#00C463
#676C7C
#17191F
#3D272C
#9B7981
#AC9498
#E4C8CE
#E5E6E6
#F61061
#4E5756
#0E0F0F
#1C2F2E
#4F7F7B
#FFC582
#D6E2E1
#D4CAAF
#B6B29A
#6F664F
#534F3E
#ECF1F7
#FF2A6C
#4E6074
#222A32
#09130F
#647970
#704FEE
#E4EBE7
#ECDCF8
#9B91A4
#78708B
#382F45
#E8EEEE
#DD5600
#596564
#050D0D
#282A2A
#5F727D
#FF1234
#E3E4E5
#161513
#79746D
#BCB7AD
#D9D6D1
#12190F
#626C5E
#D30044
#ECF1EA
#DDE8E1
#F25100
#6D8476
#1F3127
#605953
#9E948F
#DAD6CF
#FBFAF5
#E6E7E8
#D25661
#687074
#0F1112
#EDEFF3
#FD7463
#707990
#181A20
#688E79
#83B9C6
#B7D3A5
#D0D1D0
#806E74
#B28375
#B9AEAE
#EBD7C8
#E0E4E9
#BC4358
#3E5169
#090E15
#5A5934
#776D5C
#BE957B
#DFACA6