#5C8D89
#A7D7C5
#F4F9F4
#F2C57C
#FFA878Dusty Rose
#FFD8B7Peach Puff
#2A4366Charcoal
#FAFAFASnow
Sunny Dusty Rose & Charcoal is a complementary color palette tagged modern, beige, white. Near-complementary hues (about 172° apart) make this a high-contrast, attention-grabbing combination. Saturation is moderate, which keeps it flexible for both interfaces and print. Warm and cool hues are mixed, which adds depth.
Color codes click any value to copy
| Swatch | Name | HEX | RGB | HSL | OKLCH |
|---|---|---|---|---|---|
| Dusty Rose | #FFA878 | rgb(255, 168, 120) | hsl(21, 100%, 74%) | oklch(80.7% 0.121 49) | |
| Peach Puff | #FFD8B7 | rgb(255, 216, 183) | hsl(27, 100%, 86%) | oklch(90.7% 0.062 62) | |
| Charcoal | #2A4366 | rgb(42, 67, 102) | hsl(215, 42%, 28%) | oklch(38.0% 0.068 257) | |
| Snow | #FAFAFA | rgb(250, 250, 250) | hsl(0, 0%, 98%) | oklch(98.5% 0.000 0) |
Why it works and how to use it
It works because the lightness range is wide (28% to 98%), which gives clear hierarchy between background, content and accents. Try it for websites, presentations and branding.
- Background: Snow (#FAFAFA) is the lightest color, so it belongs on large surfaces.
- Text: Charcoal (#2A4366) on #FAFAFA gives 9.61:1, passing WCAG AAA.
- Primary: Dusty Rose (#FFA878) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
- Accent: Peach Puff (#FFD8B7) for highlights, badges and hover states.
3 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Charcoal on Snow at 9.61:1.
Preview on a real UI see how the palette feels in context
BrandFeaturesPricingBlogGet started
Design faster with Sunny Dusty Rose & Charcoal
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
#FFA878
#FFD8B7
#2A4366
#FAFAFA
Color-blind check: all four colors stay distinguishable under protanopia, deuteranopia and tritanopia.
Contrast check WCAG ratios between palette colors
| Pair | Sample | Ratio | Level |
|---|---|---|---|
#2A4366 on #FAFAFA | Aa | 9.61:1 | AAA |
#FFD8B7 on #2A4366 | Aa | 7.53:1 | AAA |
#FFA878 on #2A4366 | Aa | 5.31:1 | AA |
#FFA878 on #FAFAFA | Aa | 1.81:1 | Fail |
#FFA878 on #FFD8B7 | Aa | 1.42:1 | Fail |
#FFD8B7 on #FAFAFA | Aa | 1.28:1 | Fail |
Similar palettes 24 more in this mood
#FFF8F0
#FFD2CB
#FF819E
#1B3240
#FDFDFF
#FFDFBC
#B9B9B9
#222222
#6B4E1E
#00B8C4
#E8DCC0
#F7F3EA
#F8FFFF
#5CB7B8
#FFABBA
#919191
#655B57
#F36893
#C3A7A5
#FFF1E6
#142532
#528494
#DE9D89
#FAF4E9
#FFF8F0
#FFD6A5
#FF8C42
#2B2D42
#6E5700
#7EC26E
#CCFFE7
#FDFDFD
#DCFBFF
#78B9B2
#5A6164
#EEA083
#F7F2EA
#E6DCCB
#CBBBA0
#6B6155
#FFF9F4
#FFE0C7
#F28C38
#2A2320
#9D4500
#4B6642
#CDD6B4
#F6F3E9
#3C4B2C
#74814C
#FCBE7B
#FFFBE2
#FFAF7F
#E0961F
#E3FFFF
#818181
#2469A5
#C97D5A
#E8C9A8
#F8F1E7
#7A8966
#CECEA4
#F4F9F4
#FFB7BA
#F0EEEA
#5A5A5A
#FFCEB7
#B88DCD
#3C3C3C
#747474
#FFB2AA
#EEEEEE
#FFF8F0
#FFD6A5
#00BFFC
#2B2D42
#8B5E1E
#AD9FFA
#F3D48A
#FFF8E5
#685F58
#9B907E
#CBD8B6
#EEEFE8
#0F5C63
#2A8A8C
#9FD3CF
#F2F1EA
#B00020
#B28B00
#FFB4AB
#FDFDFD