#222831
#575D65
#00ADB5
#EEEEEE
#2B2B2BGunmetal
#4A4A4AGraphite
#FFABE8Cotton Candy
#F5F5F5Smoke
Cotton Candy & Gunmetal Haze is a neutral-based color palette tagged modern, dark, minimal. 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.
Color codes click any value to copy
| Swatch | Name | HEX | RGB | HSL | OKLCH |
|---|---|---|---|---|---|
| Gunmetal | #2B2B2B | rgb(43, 43, 43) | hsl(0, 0%, 17%) | oklch(28.9% 0.000 0) | |
| Graphite | #4A4A4A | rgb(74, 74, 74) | hsl(0, 0%, 29%) | oklch(40.9% 0.000 0) | |
| Cotton Candy | #FFABE8 | rgb(255, 171, 232) | hsl(316, 100%, 84%) | oklch(84.1% 0.124 337) | |
| Smoke | #F5F5F5 | rgb(245, 245, 245) | hsl(0, 0%, 96%) | oklch(97.0% 0.000 0) |
Why it works and how to use it
Two of the four colors are near-neutral, which leaves room for Cotton Candy to lead. Lightness runs from 17% to 96%. Well suited to websites, presentations and branding.
- Background: Smoke (#F5F5F5) is the lightest color, so it belongs on large surfaces.
- Text: Gunmetal (#2B2B2B) on #F5F5F5 gives 12.99:1, passing WCAG AAA.
- Primary: Cotton Candy (#FFABE8) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
- Accent: Graphite (#4A4A4A) for highlights, badges and hover states.
4 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Gunmetal on Smoke at 12.99:1.
Preview on a real UI see how the palette feels in context
BrandFeaturesPricingBlogGet started
Design faster with Cotton Candy & Gunmetal 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
#2B2B2B
#4A4A4A
#FFABE8
#F5F5F5
Color-blind check: all four colors stay distinguishable under protanopia, deuteranopia and tritanopia.
Contrast check WCAG ratios between palette colors
| Pair | Sample | Ratio | Level |
|---|---|---|---|
#2B2B2B on #F5F5F5 | Aa | 12.99:1 | AAA |
#2B2B2B on #FFABE8 | Aa | 8.25:1 | AAA |
#4A4A4A on #F5F5F5 | Aa | 8.13:1 | AAA |
#4A4A4A on #FFABE8 | Aa | 5.17:1 | AA |
#2B2B2B on #4A4A4A | Aa | 1.6:1 | Fail |
#FFABE8 on #F5F5F5 | Aa | 1.57:1 | Fail |
Similar palettes 24 more in this mood
#111111
#424242
#FF3B3B
#FAFAFA
#1A1A1D
#4C4C54
#E8788A
#F4F4F6
#EDEEF0
#C9CCD1
#1D4ED8
#0B1220
#ECF1F7
#FF2A6C
#4E6074
#222A32
#2B2B2B
#4A4A4A
#00E9DB
#F5F5F5
#F3F5F4
#AD6FDD
#4E5A58
#0F1212
#E8EEEE
#DD5600
#596564
#050D0D
#222831
#575D65
#988BDA
#EEEEEE
#121214
#5D6064
#B3CCFF
#E6EEFF
#2B2B2B
#4A4A4A
#A6E22E
#F5F5F5
#F5F5F5
#CBCBCB
#3A5400
#2B2B2B
#2C2C30
#606068
#FF90A0
#FAFAFC
#FAFAFA
#919191
#81000C
#111111
#EDEEF0
#C9CCD1
#7A5A00
#0B1220
#0F0F0F
#444444
#049C65
#F4EEE8
#EDEEF0
#C9CCD1
#006699
#05141E
#111111
#424242
#E444BE
#FAFAFA
#202020
#565656
#FF796E
#FAFAFA
#222831
#575D65
#D67A79
#EEEEEE
#0F0F0F
#444444
#C8623F
#F4EEE8
#111111
#424242
#8C9B00
#FAFAFA
#1A1A1D
#4C4C54
#00B7B2
#F4F4F6
#EDEEF0
#C9CCD1
#9714A2
#0B1220