Nearest named color · #8CB58F
#8CB58F
Nearest named color: Foliage
#8CB58F (rgb(140 181 143), hsl(124 22% 63%), oklch(0.733 0.07 146.7)) is closest to the named color Foliage. See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
#8CB58F
oklch(0.733 0.07 146.7)
Color conversions
- HEX
- #8cb58f
- RGB
- rgb(140 181 143)
- HSL
- hsl(124 22% 63%)
- HWB
- hwb(124 55% 29%)
- OKLCH
- oklch(0.733 0.07 146.7)
- OKLab
- oklab(0.733 -0.058 0.038)
- CIE Lab
- lab(69.91 -20.01 14.76)
- LCH
- lch(69.91 24.86 143.6)
- CMYK
- cmyk(23% 0% 21% 29%)
Tints · Shades · Tones
Tints
- 97BC9A
- A3C4A5
- AECBB0
- B9D2BB
- C5DAC6
- D0E1D1
- DCE9DD
- E8F0E8
- F3F7F3
Shades
- 799D7C
- 678669
- 556F57
- 435945
- 334434
- 233024
- 141D15
- 070C07
- 010201
Tones
- 8BB08E
- 8AAA8C
- 89A58B
- 88A089
- 879A88
- 859586
- 849085
- 838A83
- 818582
Color harmonies
Complementary +180°
- 8CB58F
Foliage
- C19AC0
≈ Lupine
Analogous -30° +30°
- 8CB58F
Foliage
- A5AF7C
≈ Fresh Guacamole
- 77B7A7
≈ Turtle Lake
Triadic +120° +240°
- 8CB58F
Foliage
- 95A8D6
≈ Foresight
- D19891
≈ Tobermory
Split-complementary +150° +210°
- 8CB58F
Foliage
- ADA0D0
≈ Imperial Lilac
- CD97A9
≈ Honey Pink
Tetradic +90° +180° +270°
Contrast & accessibility
Ag
FailOn white
WCAG 2.30:1 · APCA Lc 45
Ag
AAAOn black
WCAG 9.12:1 · APCA Lc 57
Best text color: #000000
WCAG 9.12:1 (AAA) · APCA Lc 57
Contrast pairs
Code snippets
CSS
:root {
--foliage: #8cb58f;
--foliage-rgb: 140 181 143;
--foliage-oklch: oklch(0.733 0.07 146.7);
}
.element {
color: var(--foliage);
background-color: hsl(124 22% 63%);
border-color: oklch(0.733 0.07 146.7);
}Tailwind CSS v4
@theme {
--color-foliage: #8cb58f;
--color-foliage-50: #e8fbea;
--color-foliage-100: #d9efdb;
--color-foliage-200: #c1ddc4;
--color-foliage-300: #9fc2a4;
--color-foliage-400: #84aa86;
--color-foliage-500: #67936b;
--color-foliage-600: #587c5b;
--color-foliage-700: #466448;
--color-foliage-800: #334933;
--color-foliage-900: #233323;
--color-foliage-950: #121e12;
}SCSS
$foliage: #8cb58f;
$foliage-rgb: 140, 181, 143;
$foliage-light: mix(#fff, $foliage, 20%);
$foliage-dark: mix(#000, $foliage, 20%);
.element {
color: $foliage;
box-shadow: 0 0 0 2px rgba($foliage, 0.35);
}