Named color · #89B89A
Garden View
Garden View is #89B89A: rgb(137 184 154), hsl(142 25% 63%), oklch(0.741 0.066 156.4). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Green mean? → · Garden View color name →
#89B89A
oklch(0.741 0.066 156.4)
Color conversions
- HEX
- #89b89a
- RGB
- rgb(137 184 154)
- HSL
- hsl(142 25% 63%)
- HWB
- hwb(142 54% 28%)
- OKLCH
- oklch(0.741 0.066 156.4)
- OKLab
- oklab(0.741 -0.061 0.026)
- CIE Lab
- lab(70.79 -20.9 10.01)
- LCH
- lch(70.79 23.17 154.4)
- CMYK
- cmyk(26% 0% 16% 28%)
Tints · Shades · Tones
Tints
- 95BFA4
- A1C6AE
- ACCDB7
- B8D4C1
- C4DBCC
- CFE2D6
- DBE9E0
- E7F1EA
- F3F8F5
Shades
- 76A085
- 648871
- 53715E
- 425B4B
- 314539
- 223127
- 141E17
- 070C09
- 010201
Tones
- 88B297
- 88AD95
- 87A792
- 86A190
- 869C8D
- 85968A
- 849188
- 828B85
- 818683
Color harmonies
Complementary +180°
- 89B89A
Garden View
- C79CBB
≈ Morning Glory Pink
Analogous -30° +30°
- 89B89A
Garden View
- A0B386
≈ Easy Green
- 7AB9B1
≈ Winter Surf
Triadic +120° +240°
- 89B89A
Garden View
- 9FA8D5
≈ Whipped Violet
- D19D8E
≈ Nectarine Spice
Split-complementary +150° +210°
- 89B89A
Garden View
- B5A1CC
≈ Glass Violet
- D09AA4
≈ Cooing Doves
Tetradic +90° +180° +270°
- 89B89A
Garden View
- 89B0D3
≈ Boo Blue
- C79CBB
≈ Morning Glory Pink
- C8A37F
≈ Pelican Tan
Contrast & accessibility
Ag
FailOn white
WCAG 2.23:1 · APCA Lc 44
Ag
AAAOn black
WCAG 9.38:1 · APCA Lc 58
Best text color: #000000
WCAG 9.38:1 (AAA) · APCA Lc 58
Contrast pairs
Code snippets
CSS
:root {
--garden-view: #89b89a;
--garden-view-rgb: 137 184 154;
--garden-view-oklch: oklch(0.741 0.066 156.4);
}
.element {
color: var(--garden-view);
background-color: hsl(142 25% 63%);
border-color: oklch(0.741 0.066 156.4);
}Tailwind CSS v4
@theme {
--color-garden-view: #89b89a;
--color-garden-view-50: #e6fbee;
--color-garden-view-100: #d6efe0;
--color-garden-view-200: #beddca;
--color-garden-view-300: #9cc2ab;
--color-garden-view-400: #7fab8e;
--color-garden-view-500: #619474;
--color-garden-view-600: #527d62;
--color-garden-view-700: #42644f;
--color-garden-view-800: #304938;
--color-garden-view-900: #203326;
--color-garden-view-950: #101e15;
}SCSS
$garden-view: #89b89a;
$garden-view-rgb: 137, 184, 154;
$garden-view-light: mix(#fff, $garden-view, 20%);
$garden-view-dark: mix(#000, $garden-view, 20%);
.element {
color: $garden-view;
box-shadow: 0 0 0 2px rgba($garden-view, 0.35);
}