Palette · 4 colors · Lc 9.7
True Pebble Orchard palette
True Pebble Orchard: a 4-color palette (Green, Gray, 4 Colors). HEX, RGB, HSL and OKLCH for #F5F5F3, #9B977E, #4B4C37, #050503, WCAG contrast on white and black, plus CSS variables, Tailwind and JSON export.
bg
#F5F5F3
surface
#9B977E
accent
#4B4C37
text
#050503
Colors in True Pebble Orchard: HEX, RGB, HSL & OKLCH
- #F5F5F3 color page →
bg
#F5F5F3
- RGB
- rgb(245 245 243)
- HSL
- hsl(60 9% 96%)
- OKLCH
- oklch(0.97 0.003 106.4)
WCAG contrast: on white 1.09:1 (Fail) · on black 19.23:1 (AAA)
- #9B977E color page →
surface
#9B977E
- RGB
- rgb(155 151 126)
- HSL
- hsl(52 13% 55%)
- OKLCH
- oklch(0.673 0.036 99.8)
WCAG contrast: on white 2.94:1 (Fail) · on black 7.12:1 (AAA)
- #4B4C37 color page →
accent
#4B4C37
- RGB
- rgb(75 76 55)
- HSL
- hsl(63 16% 26%)
- OKLCH
- oklch(0.409 0.033 110.1)
WCAG contrast: on white 8.79:1 (AAA) · on black 2.38:1 (Fail)
- #050503 color page →
text
#050503
- RGB
- rgb(5 5 3)
- HSL
- hsl(60 25% 2%)
- OKLCH
- oklch(0.113 0.008 107.6)
WCAG contrast: on white 20.39:1 (AAA) · on black 1.02:1 (Fail)
Export True Pebble Orchard: CSS variables, Tailwind & JSON
CSS variables
:root {
--bg: #f5f5f3;
--surface: #9b977e;
--accent: #4b4c37;
--text: #050503;
}Tailwind CSS v4 @theme
@theme {
--color-bg: #f5f5f3;
--color-surface: #9b977e;
--color-accent: #4b4c37;
--color-text: #050503;
}JSON (DTCG tokens)
{
"true-pebble-orchard-7fn": {
"bg": {
"$type": "color",
"$value": "#f5f5f3"
},
"surface": {
"$type": "color",
"$value": "#9b977e"
},
"accent": {
"$type": "color",
"$value": "#4b4c37"
},
"text": {
"$type": "color",
"$value": "#050503"
}
}
}About this palette
True Pebble Orchard is a 4-color OKLCH-ready palette tagged green, gray, 4 colors. Hex values: #F5F5F3, #9B977E, #4B4C37, #050503. APCA contrast score Lc 9.7. 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 Pebble Orchard by OKLab color distance.