#DBD8D4
#CBC0B6
#B14A27
#1E1612
#E9E9E9Frost
#CACAC9Lavender Gray
#D88A00Caramel
#0A0806Obsidian
Quiet Caramel & Obsidian is a neutral-based color palette tagged modern, minimal, gray. Caramel 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 warm.
Color codes click any value to copy
| Swatch | Name | HEX | RGB | HSL | OKLCH |
|---|---|---|---|---|---|
| Frost | #E9E9E9 | rgb(233, 233, 233) | hsl(0, 0%, 91%) | oklch(93.4% 0.000 0) | |
| Lavender Gray | #CACAC9 | rgb(202, 202, 201) | hsl(60, 1%, 79%) | oklch(83.9% 0.001 106) | |
| Caramel | #D88A00 | rgb(216, 138, 0) | hsl(38, 100%, 42%) | oklch(69.7% 0.151 70) | |
| Obsidian | #0A0806 | rgb(10, 8, 6) | hsl(30, 25%, 3%) | oklch(13.6% 0.006 71) |
Why it works and how to use it
The palette holds together thanks to its neutral backbone and a strong light-to-dark ladder (91% down to 3% lightness). A natural fit for websites, presentations and branding.
- Background: Frost (#E9E9E9) is the lightest color, so it belongs on large surfaces.
- Text: Obsidian (#0A0806) on #E9E9E9 gives 16.47:1, passing WCAG AAA.
- Primary: Caramel (#D88A00) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
- Accent: Lavender Gray (#CACAC9) for highlights, badges and hover states.
3 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Frost on Obsidian at 16.47:1.
Preview on a real UI see how the palette feels in context
BrandFeaturesPricingBlogGet started
Design faster with Quiet Caramel & 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
#E9E9E9
#CACAC9
#D88A00
#0A0806
Color-blind check: all four colors stay distinguishable under protanopia, deuteranopia and tritanopia.
Contrast check WCAG ratios between palette colors
| Pair | Sample | Ratio | Level |
|---|---|---|---|
#E9E9E9 on #0A0806 | Aa | 16.47:1 | AAA |
#CACAC9 on #0A0806 | Aa | 12.19:1 | AAA |
#D88A00 on #0A0806 | Aa | 7.19:1 | AAA |
#E9E9E9 on #D88A00 | Aa | 2.29:1 | Fail |
#CACAC9 on #D88A00 | Aa | 1.69:1 | Fail |
#E9E9E9 on #CACAC9 | Aa | 1.35:1 | Fail |
Similar palettes 24 more in this mood
#EDEEF0
#C9CCD1
#7A5A00
#0B1220
#24150D
#654635
#7ABDAA
#D7D3CE
#0F0F0F
#444444
#C8623F
#F4EEE8
#DADAD9
#BDBDB8
#C19900
#0F0F0D
#111111
#424242
#FF3B3B
#FAFAFA
#1A1A1D
#4C4C54
#E8788A
#F4F4F6
#FFFFFF
#E4E4E3
#F59E0B
#1C1917
#FFF7F9
#EED8E0
#E11D74
#2B1720
#EDEEF0
#C9CCD1
#1D4ED8
#0B1220
#0A1A1E
#648691
#EED200
#D8E2E5
#DDDEE2
#00C463
#676C7C
#17191F
#3D272C
#9B7981
#AC9498
#E4C8CE
#E5E6E6
#F61061
#4E5756
#0E0F0F
#E3DCDE
#CDB8C0
#BF005F
#17060E
#09130F
#647970
#704FEE
#E4EBE7
#F3F5F4
#AD6FDD
#4E5A58
#0F1212
#E8EEEE
#DD5600
#596564
#050D0D
#2B2D42
#8D99AE
#EDF2F4
#A97B00
#121214
#5D6064
#B3CCFF
#E6EEFF
#050F29
#E08F00
#CBCBCB
#E7E7E7
#524037
#8E6C5A
#ADF2DF
#FDF9F4
#D1D2D4
#B0B3B8
#0C37C1
#01030D
#09090C
#3C3C44
#CF6274
#DADADC