Nearest named color · #144700
#144700
Nearest named color: Woodland Grass
#144700 (rgb(20 71 0), hsl(103 100% 14%), oklch(0.35 0.111 139.2)) is closest to the named color Woodland Grass. See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
#144700
oklch(0.35 0.111 139.2)
Color conversions
- HEX
- #144700
- RGB
- rgb(20 71 0)
- HSL
- hsl(103 100% 14%)
- HWB
- hwb(103 0% 72%)
- OKLCH
- oklch(0.35 0.111 139.2)
- OKLab
- oklab(0.35 -0.084 0.072)
- CIE Lab
- lab(25.78 -27.67 32.72)
- LCH
- lch(25.78 42.85 130.2)
- CMYK
- cmyk(72% 0% 100% 72%)
Tints · Shades · Tones
Tints
- 2C581F
- 426937
- 587B4F
- 6F8D67
- 869F7F
- 9DB297
- B5C5B1
- CDD8CA
- E6EBE4
Shades
- 103D00
- 0C3200
- 082800
- 051F00
- 031600
- 010D00
- 010600
- 000200
- 000000
Tones
- 214D13
- 2C5322
- 37582E
- 425E3A
- 4C6446
- 566A51
- 616F5D
- 6B7569
- 767A74
Color harmonies
Complementary +180°
- 144700
Woodland Grass
- 52235E
≈ Elegant Purple Gown
Analogous -30° +30°
- 144700
Woodland Grass
- 3E3D00
≈ Dark Olive
- 004634
≈ UP Forest Green
Triadic +120° +240°
- 144700
Woodland Grass
- 113873
≈ Azure Dragon
- 681A22
≈ Pohutukawa
Split-complementary +150° +210°
- 144700
Woodland Grass
- 3B2D6F
≈ Her Highness
- 611B43
≈ Plum Caspia
Tetradic +90° +180° +270°
- 144700
Woodland Grass
- 004157
≈ Maniac Mansion
- 52235E
≈ Elegant Purple Gown
- 602800
≈ Hot Fudge
Contrast & accessibility
Ag
AAAOn white
WCAG 10.87:1 · APCA Lc 95
Ag
FailOn black
WCAG 1.93:1 · APCA Lc 8
Best text color: #FFFFFF
WCAG 10.87:1 (AAA) · APCA Lc 95
Contrast pairs
Code snippets
CSS
:root {
--woodland-grass: #144700;
--woodland-grass-rgb: 20 71 0;
--woodland-grass-oklch: oklch(0.35 0.111 139.2);
}
.element {
color: var(--woodland-grass);
background-color: hsl(103 100% 14%);
border-color: oklch(0.35 0.111 139.2);
}Tailwind CSS v4
@theme {
--color-woodland-grass: #144700;
--color-woodland-grass-50: #e4fee0;
--color-woodland-grass-100: #d4f2cf;
--color-woodland-grass-200: #bbe1b5;
--color-woodland-grass-300: #98c691;
--color-woodland-grass-400: #7cae6e;
--color-woodland-grass-500: #5e974e;
--color-woodland-grass-600: #508042;
--color-woodland-grass-700: #3f6735;
--color-woodland-grass-800: #2f4b23;
--color-woodland-grass-900: #203418;
--color-woodland-grass-950: #0f1f08;
}SCSS
$woodland-grass: #144700;
$woodland-grass-rgb: 20, 71, 0;
$woodland-grass-light: mix(#fff, $woodland-grass, 20%);
$woodland-grass-dark: mix(#000, $woodland-grass, 20%);
.element {
color: $woodland-grass;
box-shadow: 0 0 0 2px rgba($woodland-grass, 0.35);
}