#111318
#454A54
#F4A7B9
#FBFBFC
#27292FRaisin
#585D68Storm
#FFC5D2Bubblegum
#FAFAFBSnow
Bubblegum & Storm Glow is a neutral-based color palette tagged dark, minimal, gray. Built almost entirely from neutrals, with Bubblegum (#FFC5D2) as the single point of color. Saturation is moderate, which keeps it flexible for both interfaces and print.
Color codes click any value to copy
| Swatch | Name | HEX | RGB | HSL | OKLCH |
|---|---|---|---|---|---|
| Raisin | #27292F | rgb(39, 41, 47) | hsl(225, 9%, 17%) | oklch(28.1% 0.011 271) | |
| Storm | #585D68 | rgb(88, 93, 104) | hsl(221, 8%, 38%) | oklch(47.8% 0.019 266) | |
| Bubblegum | #FFC5D2 | rgb(255, 197, 210) | hsl(347, 100%, 89%) | oklch(87.9% 0.068 4) | |
| Snow | #FAFAFB | rgb(250, 250, 251) | hsl(240, 11%, 98%) | oklch(98.5% 0.001 286) |
Why it works and how to use it
Two of the four colors are near-neutral, which leaves room for Bubblegum to lead. Lightness runs from 17% to 98%. Well suited to websites, presentations and branding.
- Background: Snow (#FAFAFB) is the lightest color, so it belongs on large surfaces.
- Text: Raisin (#27292F) on #FAFAFB gives 13.94:1, passing WCAG AAA.
- Primary: Bubblegum (#FFC5D2) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
- Accent: Storm (#585D68) for highlights, badges and hover states.
3 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Raisin on Snow at 13.94:1.
Preview on a real UI see how the palette feels in context
BrandFeaturesPricingBlogGet started
Design faster with Bubblegum & Storm Glow
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
#27292F
#585D68
#FFC5D2
#FAFAFB
Color-blind check: all four colors stay distinguishable under protanopia, deuteranopia and tritanopia.
Contrast check WCAG ratios between palette colors
| Pair | Sample | Ratio | Level |
|---|---|---|---|
#27292F on #FAFAFB | Aa | 13.94:1 | AAA |
#27292F on #FFC5D2 | Aa | 9.81:1 | AAA |
#585D68 on #FAFAFB | Aa | 6.33:1 | AA |
#585D68 on #FFC5D2 | Aa | 4.45:1 | AA large only |
#27292F on #585D68 | Aa | 2.2:1 | Fail |
#FFC5D2 on #FAFAFB | Aa | 1.42:1 | Fail |
Similar palettes 24 more in this mood
#ECF1F7
#FF2A6C
#4E6074
#222A32
#0E0E0E
#434343
#F5B7C4
#FFF7F9
#2C2C30
#606068
#FF90A0
#FAFAFC
#1E1B18
#6B5D4F
#C9B79C
#F4EFE6
#202020
#565656
#FF796E
#FAFAFA
#222831
#575D65
#00ADB5
#EEEEEE
#222831
#575D65
#D67A79
#EEEEEE
#000000
#3A3A3A
#D4AF37
#F2F2F2
#3E2723
#6D4C41
#A1887F
#EFEBE9
#212529
#525A61
#ADB5BD
#F8F9FA
#0A0A0A
#3D3D3D
#CCFF00
#FFFFFF
#1E1E1E
#575757
#8A8A8A
#EDEDED
#111111
#424242
#FF3B3B
#FAFAFA
#0B0F14
#3C4552
#2EE6A6
#E6EDF3
#1A1A1D
#4C4C54
#E8788A
#F4F4F6
#161B22
#484E55
#F0B429
#E6EDF3
#0F1419
#3E4C59
#D9B99B
#F3EFE9
#18191A
#4F5052
#B8F53F
#F7F7F5
#141210
#4D4742
#C97B3A
#F2EAE2
#FBFBF9
#DFE1DD
#4C6B58
#1F2A24
#EDEEF0
#C9CCD1
#1D4ED8
#0B1220
#050505
#373737
#AA5C00
#FDFDFD
#F0F0F0
#7454DD
#574F44
#0E0E0E