Palette · 8 colors · Lc 9.9
Muddy Brown Beacon palette
Muddy Brown Beacon: a 8-color palette (Green, 8 Colors). HEX, RGB, HSL and OKLCH for #E7F7FD, #5FB9DA, #008FA1, #856B00, #7F3A57, #183654, #102229, #000B13, WCAG contrast on white and black, plus CSS variables, Tailwind and JSON export.
- Green
- 8 Colors
bg
#E7F7FD
surface
#5FB9DA
muted
#008FA1
primary
#856B00
secondary
#7F3A57
accent
#183654
highlight
#102229
text
#000B13
Colors in Muddy Brown Beacon: HEX, RGB, HSL & OKLCH
- #E7F7FD color page →
bg
#E7F7FD
- RGB
- rgb(231 247 253)
- HSL
- hsl(196 85% 95%)
- OKLCH
- oklch(0.966 0.019 222.2)
WCAG contrast: on white 1.09:1 (Fail) · on black 19.12:1 (AAA)
- #5FB9DA color page →
surface
#5FB9DA
- RGB
- rgb(95 185 218)
- HSL
- hsl(196 62% 61%)
- OKLCH
- oklch(0.743 0.098 224.5)
WCAG contrast: on white 2.22:1 (Fail) · on black 9.43:1 (AAA)
- #008FA1 color page →
muted
#008FA1
- RGB
- rgb(0 143 161)
- HSL
- hsl(187 100% 32%)
- OKLCH
- oklch(0.596 0.103 210.3)
WCAG contrast: on white 3.85:1 (Fail) · on black 5.44:1 (AA)
- #856B00 color page →
primary
#856B00
- RGB
- rgb(133 107 0)
- HSL
- hsl(48 100% 26%)
- OKLCH
- oklch(0.538 0.11 92)
WCAG contrast: on white 5.12:1 (AA) · on black 4.10:1 (Fail)
- #7F3A57 color page →
secondary
#7F3A57
- RGB
- rgb(127 58 87)
- HSL
- hsl(335 37% 36%)
- OKLCH
- oklch(0.448 0.101 355.5)
WCAG contrast: on white 7.93:1 (AAA) · on black 2.64:1 (Fail)
- #183654 color page →
accent
#183654
- RGB
- rgb(24 54 84)
- HSL
- hsl(210 56% 21%)
- OKLCH
- oklch(0.326 0.065 250.4)
WCAG contrast: on white 12.39:1 (AAA) · on black 1.69:1 (Fail)
- #102229 color page →
highlight
#102229
- RGB
- rgb(16 34 41)
- HSL
- hsl(197 44% 11%)
- OKLCH
- oklch(0.24 0.027 225.1)
WCAG contrast: on white 16.36:1 (AAA) · on black 1.28:1 (Fail)
- #000B13 color page →
text
#000B13
- RGB
- rgb(0 11 19)
- HSL
- hsl(205 100% 4%)
- OKLCH
- oklch(0.141 0.029 232.3)
WCAG contrast: on white 19.86:1 (AAA) · on black 1.05:1 (Fail)
Export Muddy Brown Beacon: CSS variables, Tailwind & JSON
CSS variables
:root {
--bg: #e7f7fd;
--surface: #5fb9da;
--muted: #008fa1;
--primary: #856b00;
--secondary: #7f3a57;
--accent: #183654;
--highlight: #102229;
--text: #000b13;
}Tailwind CSS v4 @theme
@theme {
--color-bg: #e7f7fd;
--color-surface: #5fb9da;
--color-muted: #008fa1;
--color-primary: #856b00;
--color-secondary: #7f3a57;
--color-accent: #183654;
--color-highlight: #102229;
--color-text: #000b13;
}JSON (DTCG tokens)
{
"muddy-brown-beacon-1xf": {
"bg": {
"$type": "color",
"$value": "#e7f7fd"
},
"surface": {
"$type": "color",
"$value": "#5fb9da"
},
"muted": {
"$type": "color",
"$value": "#008fa1"
},
"primary": {
"$type": "color",
"$value": "#856b00"
},
"secondary": {
"$type": "color",
"$value": "#7f3a57"
},
"accent": {
"$type": "color",
"$value": "#183654"
},
"highlight": {
"$type": "color",
"$value": "#102229"
},
"text": {
"$type": "color",
"$value": "#000b13"
}
}
}About this palette
Muddy Brown Beacon is a 8-color OKLCH-ready palette tagged green, 8 colors. Hex values: #E7F7FD, #5FB9DA, #008FA1, #856B00, #7F3A57, #183654, #102229, #000B13. APCA contrast score Lc 9.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 Muddy Brown Beacon by OKLab color distance.