Palette · 9 colors · Lc 8.9
Bold Magentle Grove palette
Bold Magentle Grove: a 9-color palette (Red, Warm, UI System, 9 Colors). HEX, RGB, HSL and OKLCH for #F2F2F2, #F3E7F2, #E2CDE3, #CFA4CF, #BD6BC7, #A905A1, #A11B73, #632352, #170F17, WCAG contrast on white and black, plus CSS variables, Tailwind and JSON export.
bg
#F2F2F2
surface
#F3E7F2
muted
#E2CDE3
primary
#CFA4CF
secondary
#BD6BC7
accent
#A905A1
highlight
#A11B73
border
#632352
text
#170F17
Colors in Bold Magentle Grove: HEX, RGB, HSL & OKLCH
- #F2F2F2 color page →
bg
#F2F2F2
- RGB
- rgb(242 242 242)
- HSL
- hsl(0 0% 95%)
- OKLCH
- oklch(0.961 0 0)
WCAG contrast: on white 1.11:1 (Fail) · on black 18.75:1 (AAA)
- #F3E7F2 color page →
surface
#F3E7F2
- RGB
- rgb(243 231 242)
- HSL
- hsl(305 33% 93%)
- OKLCH
- oklch(0.941 0.019 328.3)
WCAG contrast: on white 1.19:1 (Fail) · on black 17.52:1 (AAA)
- #E2CDE3 color page →
muted
#E2CDE3
- RGB
- rgb(226 205 227)
- HSL
- hsl(297 28% 85%)
- OKLCH
- oklch(0.872 0.038 324.5)
WCAG contrast: on white 1.49:1 (Fail) · on black 14.07:1 (AAA)
- #CFA4CF color page →
primary
#CFA4CF
- RGB
- rgb(207 164 207)
- HSL
- hsl(300 31% 73%)
- OKLCH
- oklch(0.771 0.077 326.3)
WCAG contrast: on white 2.12:1 (Fail) · on black 9.86:1 (AAA)
- #BD6BC7 color page →
secondary
#BD6BC7
- RGB
- rgb(189 107 199)
- HSL
- hsl(293 45% 60%)
- OKLCH
- oklch(0.653 0.158 323.1)
WCAG contrast: on white 3.44:1 (Fail) · on black 6.09:1 (AA)
- #A905A1 color page →
accent
#A905A1
- RGB
- rgb(169 5 161)
- HSL
- hsl(303 94% 34%)
- OKLCH
- oklch(0.512 0.23 330.9)
WCAG contrast: on white 6.51:1 (AA) · on black 3.22:1 (Fail)
- #A11B73 color page →
highlight
#A11B73
- RGB
- rgb(161 27 115)
- HSL
- hsl(321 71% 37%)
- OKLCH
- oklch(0.483 0.185 346.5)
WCAG contrast: on white 7.19:1 (AAA) · on black 2.91:1 (Fail)
- #632352 color page →
border
#632352
- RGB
- rgb(99 35 82)
- HSL
- hsl(316 48% 26%)
- OKLCH
- oklch(0.369 0.11 339.4)
WCAG contrast: on white 11.09:1 (AAA) · on black 1.89:1 (Fail)
- #170F17 color page →
text
#170F17
- RGB
- rgb(23 15 23)
- HSL
- hsl(300 21% 7%)
- OKLCH
- oklch(0.183 0.02 326.4)
WCAG contrast: on white 18.79:1 (AAA) · on black 1.11:1 (Fail)
Export Bold Magentle Grove: CSS variables, Tailwind & JSON
CSS variables
:root {
--bg: #f2f2f2;
--surface: #f3e7f2;
--muted: #e2cde3;
--primary: #cfa4cf;
--secondary: #bd6bc7;
--accent: #a905a1;
--highlight: #a11b73;
--border: #632352;
--text: #170f17;
}Tailwind CSS v4 @theme
@theme {
--color-bg: #f2f2f2;
--color-surface: #f3e7f2;
--color-muted: #e2cde3;
--color-primary: #cfa4cf;
--color-secondary: #bd6bc7;
--color-accent: #a905a1;
--color-highlight: #a11b73;
--color-border: #632352;
--color-text: #170f17;
}JSON (DTCG tokens)
{
"bold-magentle-grove-ww": {
"bg": {
"$type": "color",
"$value": "#f2f2f2"
},
"surface": {
"$type": "color",
"$value": "#f3e7f2"
},
"muted": {
"$type": "color",
"$value": "#e2cde3"
},
"primary": {
"$type": "color",
"$value": "#cfa4cf"
},
"secondary": {
"$type": "color",
"$value": "#bd6bc7"
},
"accent": {
"$type": "color",
"$value": "#a905a1"
},
"highlight": {
"$type": "color",
"$value": "#a11b73"
},
"border": {
"$type": "color",
"$value": "#632352"
},
"text": {
"$type": "color",
"$value": "#170f17"
}
}
}About this palette
Bold Magentle Grove is a 9-color OKLCH-ready palette tagged red, warm, ui system, 9 colors. Hex values: #F2F2F2, #F3E7F2, #E2CDE3, #CFA4CF, #BD6BC7, #A905A1, #A11B73, #632352, #170F17. APCA contrast score Lc 8.9. Open it in Colorise Pro Studio to lock roles and regenerate harmonies.
Related palettes
Shared tags, similar size and contrast.
Palettes with similar colors
Closest to Bold Magentle Grove by OKLab color distance.