#111111
#424242
#FF3B3B
#FAFAFA
#A70022Cranberry
#E0E0E0Bone
#1D222ERaisin
#C1C6D1Lavender Gray
Bold Cranberry & Raisin is a split color palette tagged minimal, dark, red. A split scheme: Cranberry plays against Raisin across roughly 126° of hue. 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 |
|---|---|---|---|---|---|
| Cranberry | #A70022 | rgb(167, 0, 34) | hsl(348, 100%, 33%) | oklch(46.0% 0.185 22) | |
| Bone | #E0E0E0 | rgb(224, 224, 224) | hsl(0, 0%, 88%) | oklch(90.7% 0.000 0) | |
| Raisin | #1D222E | rgb(29, 34, 46) | hsl(222, 23%, 15%) | oklch(25.3% 0.024 267) | |
| Lavender Gray | #C1C6D1 | rgb(193, 198, 209) | hsl(221, 15%, 79%) | oklch(82.6% 0.016 266) |
Why it works and how to use it
The palette holds together thanks to its split hue relationship and a strong light-to-dark ladder (88% down to 15% lightness). A natural fit for websites, presentations and branding.
- Background: Bone (#E0E0E0) is the lightest color, so it belongs on large surfaces.
- Text: Raisin (#1D222E) on #E0E0E0 gives 12.05:1, passing WCAG AAA.
- Primary: Cranberry (#A70022) is the most saturated mid-tone; use it for buttons and links (5.97:1 against the background, fine for UI elements).
- Accent: Lavender Gray (#C1C6D1) for highlights, badges and hover states.
4 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Bone on Raisin at 12.05:1.
Preview on a real UI see how the palette feels in context
BrandFeaturesPricingBlogGet started
Design faster with Bold Cranberry & Raisin
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
#A70022
#E0E0E0
#1D222E
#C1C6D1
Color-blind check: under protanopia, Bone and Lavender Gray become hard to tell apart, so do not rely on that pair alone to carry meaning.
Contrast check WCAG ratios between palette colors
| Pair | Sample | Ratio | Level |
|---|---|---|---|
#E0E0E0 on #1D222E | Aa | 12.05:1 | AAA |
#1D222E on #C1C6D1 | Aa | 9.29:1 | AAA |
#A70022 on #E0E0E0 | Aa | 5.97:1 | AA |
#A70022 on #C1C6D1 | Aa | 4.6:1 | AA |
#A70022 on #1D222E | Aa | 2.02:1 | Fail |
#E0E0E0 on #C1C6D1 | Aa | 1.3:1 | Fail |
Similar palettes 24 more in this mood
#2B2B2B
#6B4E3D
#C0392B
#F4EFEA
#E0DCD9
#C2B8B3
#8B232A
#1C1110
#040404
#313131
#E20C20
#E2E2E2
#FAFAFA
#919191
#81000C
#111111
#1E1B18
#6B5D4F
#C9B79C
#F4EFE6
#F0F0F0
#876856
#A01309
#2E2A27
#0B0F0E
#3A4642
#BEF62F
#F3FFE0
#222831
#575D65
#00ADB5
#EEEEEE
#E8E8E8
#CECECE
#030303
#AA0023
#ECF2F7
#DF2E05
#3C4F5E
#0A1218
#950015
#DCD5CC
#BEA893
#080808
#000000
#3A3A3A
#D4AF37
#F2F2F2
#3E2723
#6D4C41
#A1887F
#EFEBE9
#212529
#525A61
#ADB5BD
#F8F9FA
#0A0A0A
#3D3D3D
#CCFF00
#FFFFFF
#1E1E1E
#575757
#8A8A8A
#EDEDED
#2B2D42
#8D99AE
#EDF2F4
#EF233C
#0B0F14
#3C4552
#2EE6A6
#E6EDF3
#1A1A1D
#4C4C54
#E8788A
#F4F4F6
#161B22
#484E55
#F0B429
#E6EDF3
#111318
#454A54
#F4A7B9
#FBFBFC
#0F1419
#3E4C59
#D9B99B
#F3EFE9
#18191A
#4F5052
#B8F53F
#F7F7F5