Palette · 4 colors · Lc 9.6
True Flood Canvas palette
True Flood Canvas: a 4-color palette (Pink, 4 Colors). HEX, RGB, HSL and OKLCH for #ECEFFB, #5F75C7, #5C7323, #0D1120, WCAG contrast on white and black, plus CSS variables, Tailwind and JSON export.
- Pink
- 4 Colors
bg
#ECEFFB
surface
#5F75C7
accent
#5C7323
text
#0D1120
Colors in True Flood Canvas: HEX, RGB, HSL & OKLCH
- #ECEFFB color page →
bg
#ECEFFB
- RGB
- rgb(236 239 251)
- HSL
- hsl(228 65% 95%)
- OKLCH
- oklch(0.953 0.016 274.8)
WCAG contrast: on white 1.14:1 (Fail) · on black 18.30:1 (AAA)
- #5F75C7 color page →
surface
#5F75C7
- RGB
- rgb(95 117 199)
- HSL
- hsl(227 48% 58%)
- OKLCH
- oklch(0.583 0.128 270.7)
WCAG contrast: on white 4.32:1 (Fail) · on black 4.85:1 (AA)
- #5C7323 color page →
accent
#5C7323
- RGB
- rgb(92 115 35)
- HSL
- hsl(77 53% 29%)
- OKLCH
- oklch(0.52 0.109 124)
WCAG contrast: on white 5.34:1 (AA) · on black 3.93:1 (Fail)
- #0D1120 color page →
text
#0D1120
- RGB
- rgb(13 17 32)
- HSL
- hsl(227 42% 9%)
- OKLCH
- oklch(0.182 0.032 271.6)
WCAG contrast: on white 18.78:1 (AAA) · on black 1.11:1 (Fail)
Export True Flood Canvas: CSS variables, Tailwind & JSON
CSS variables
:root {
--bg: #eceffb;
--surface: #5f75c7;
--accent: #5c7323;
--text: #0d1120;
}Tailwind CSS v4 @theme
@theme {
--color-bg: #eceffb;
--color-surface: #5f75c7;
--color-accent: #5c7323;
--color-text: #0d1120;
}JSON (DTCG tokens)
{
"true-flood-canvas-5jx": {
"bg": {
"$type": "color",
"$value": "#eceffb"
},
"surface": {
"$type": "color",
"$value": "#5f75c7"
},
"accent": {
"$type": "color",
"$value": "#5c7323"
},
"text": {
"$type": "color",
"$value": "#0d1120"
}
}
}About this palette
True Flood Canvas is a 4-color OKLCH-ready palette tagged pink, 4 colors. Hex values: #ECEFFB, #5F75C7, #5C7323, #0D1120. APCA contrast score Lc 9.6. 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 True Flood Canvas by OKLab color distance.