#FFF4F6
#FFC9D6
#FFE7A8
#7A5C6B
#3B3441Onyx
#83688DDove Gray
#FFB4CFCotton Candy
#FFE7F2Petal
Cotton Candy & Dove Gray Drift is a neutral-based color palette tagged muted, gray, pink. Cotton Candy 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 |
|---|---|---|---|---|---|
| Onyx | #3B3441 | rgb(59, 52, 65) | hsl(272, 11%, 23%) | oklch(33.8% 0.024 309) | |
| Dove Gray | #83688D | rgb(131, 104, 141) | hsl(284, 15%, 48%) | oklch(55.7% 0.064 317) | |
| Cotton Candy | #FFB4CF | rgb(255, 180, 207) | hsl(338, 100%, 85%) | oklch(84.8% 0.093 356) | |
| Petal | #FFE7F2 | rgb(255, 231, 242) | hsl(333, 100%, 95%) | oklch(95.0% 0.030 348) |
Why it works and how to use it
The palette holds together thanks to its neutral backbone and a strong light-to-dark ladder (95% down to 23% lightness). A natural fit for websites, presentations and branding.
- Background: Petal (#FFE7F2) is the lightest color, so it belongs on large surfaces.
- Text: Onyx (#3B3441) on #FFE7F2 gives 10.25:1, passing WCAG AAA.
- Primary: Cotton Candy (#FFB4CF) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
- Accent: Dove Gray (#83688D) for highlights, badges and hover states.
2 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Onyx on Petal at 10.25:1.
Preview on a real UI see how the palette feels in context
BrandFeaturesPricingBlogGet started
Design faster with Cotton Candy & Dove Gray Drift
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
#3B3441
#83688D
#FFB4CF
#FFE7F2
Color-blind check: all four colors stay distinguishable under protanopia, deuteranopia and tritanopia.
Contrast check WCAG ratios between palette colors
| Pair | Sample | Ratio | Level |
|---|---|---|---|
#3B3441 on #FFE7F2 | Aa | 10.25:1 | AAA |
#3B3441 on #FFB4CF | Aa | 7.23:1 | AAA |
#83688D on #FFE7F2 | Aa | 4.15:1 | AA large only |
#83688D on #FFB4CF | Aa | 2.93:1 | Fail |
#3B3441 on #83688D | Aa | 2.47:1 | Fail |
#FFB4CF on #FFE7F2 | Aa | 1.42:1 | Fail |
Similar palettes 24 more in this mood
#FBF6F0
#F3DCD4
#E8B4B8
#B8A184
#FFB9CA
#FFF5F7
#B2CBB1
#4F6053
#A47864
#C9A58B
#E8D9CB
#F7F3EE
#3C5148
#7A9B76
#C8D5B9
#F6F5EE
#FFC4C2
#6C6C6C
#976974
#F9FFFC
#3E2723
#6D4C41
#A1887F
#EFEBE9
#006D77
#83C5BE
#EDF6F9
#FFDDD2
#7D6E5D
#B9A990
#E7DFD3
#F9F7F3
#5D4037
#8D6E63
#BCAAA4
#EFEBE9
#4B3832
#854442
#BE9B7B
#FFF4E6
#B76E79
#E8A0A6
#F4C8C8
#FDF2F0
#5B7B6C
#8AA399
#C4D3CC
#EEF3F0
#EAF7EF
#BFE8D2
#F9E1C4
#4A6B5A
#F7FBFF
#D5E2ED
#ADCAE3
#2C4A66
#5E8B86
#A7C4BC
#D9A87E
#F6F0E6
#9E6B73
#C99CA2
#E9D5D3
#F7F2EF
#5B4B5E
#8A7A8C
#C9BEC6
#F2EEF0
#924A43
#5C6049
#D5D2BF
#F5F3ED
#FFE9DF
#D29E75
#AAB891
#807B73
#DCABC0
#BCB5F1
#FFC0BD
#F7ECF9
#FFAFCC
#BDE0FE
#CDB4DB
#FFFFFF
#F7E9DF
#FFC8D4
#E9AFD8
#C29991
#574276
#595D6D
#9E819B
#EBA3B8