Named color · #99A798
Green Trellis
Green Trellis is #99A798: rgb(153 167 152), hsl(116 8% 63%), oklch(0.713 0.027 143.4). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Gray mean? → · Green Trellis color name →
#99A798
oklch(0.713 0.027 143.4)
Color conversions
- HEX
- #99a798
- RGB
- rgb(153 167 152)
- HSL
- hsl(116 8% 63%)
- HWB
- hwb(116 60% 35%)
- OKLCH
- oklch(0.713 0.027 143.4)
- OKLab
- oklab(0.713 -0.021 0.016)
- CIE Lab
- lab(67.05 -7.29 6.02)
- LCH
- lch(67.05 9.45 140.4)
- CMYK
- cmyk(8% 0% 9% 35%)
Tints · Shades · Tones
Tints
- A3AFA2
- ADB8AC
- B7C1B6
- C1C9C0
- CBD2CA
- D5DBD5
- DFE4DF
- EAEDEA
- F4F6F4
Shades
- 849184
- 707B70
- 5D665C
- 4A524A
- 383E38
- 272C27
- 171A17
- 080A08
- 010101
Tones
- 96A396
- 949F93
- 919B91
- 8F978E
- 8C938C
- 8A8F8A
- 878C87
- 858885
- 828482
Color harmonies
Complementary +180°
- 99A798
Green Trellis
- AB9DAC
≈ Goose Wing Grey
Analogous -30° +30°
- 99A798
Green Trellis
- A2A592
≈ Coastal Plain
- 92A8A1
≈ Lotus Leaf
Triadic +120° +240°
- 99A798
Green Trellis
- 9AA3B4
≈ Moon Shadow
- B39C9A
≈ Violet Dusk
Split-complementary +150° +210°
- 99A798
Green Trellis
- A3A0B2
≈ Lazy Lavender
- B19CA4
≈ Decorum
Tetradic +90° +180° +270°
- 99A798
Green Trellis
- 93A6B1
≈ Cadet Grey
- AB9DAC
≈ Goose Wing Grey
- B09E93
≈ Simply Taupe
Contrast & accessibility
Ag
FailOn white
WCAG 2.51:1 · APCA Lc 49
Ag
AAAOn black
WCAG 8.33:1 · APCA Lc 53
Best text color: #000000
WCAG 8.33:1 (AAA) · APCA Lc 53
Contrast pairs
Code snippets
CSS
:root {
--green-trellis: #99a798;
--green-trellis-rgb: 153 167 152;
--green-trellis-oklch: oklch(0.713 0.027 143.4);
}
.element {
color: var(--green-trellis);
background-color: hsl(116 8% 63%);
border-color: oklch(0.713 0.027 143.4);
}Tailwind CSS v4
@theme {
--color-green-trellis: #99a798;
--color-green-trellis-50: #f1f7f1;
--color-green-trellis-100: #e3eae3;
--color-green-trellis-200: #cdd7cd;
--color-green-trellis-300: #afbbaf;
--color-green-trellis-400: #96a395;
--color-green-trellis-500: #7c8b7b;
--color-green-trellis-600: #697668;
--color-green-trellis-700: #545e53;
--color-green-trellis-800: #3d453c;
--color-green-trellis-900: #2a3029;
--color-green-trellis-950: #181c17;
}SCSS
$green-trellis: #99a798;
$green-trellis-rgb: 153, 167, 152;
$green-trellis-light: mix(#fff, $green-trellis, 20%);
$green-trellis-dark: mix(#000, $green-trellis, 20%);
.element {
color: $green-trellis;
box-shadow: 0 0 0 2px rgba($green-trellis, 0.35);
}