Named color · #97D499
Young Greens
Young Greens is #97D499: rgb(151 212 153), hsl(122 41% 71%), oklch(0.813 0.103 145.3). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Green mean? → · Young Greens color name →
#97D499
oklch(0.813 0.103 145.3)
Color conversions
- HEX
- #97d499
- RGB
- rgb(151 212 153)
- HSL
- hsl(122 41% 71%)
- HWB
- hwb(122 59% 17%)
- OKLCH
- oklch(0.813 0.103 145.3)
- OKLab
- oklab(0.813 -0.085 0.059)
- CIE Lab
- lab(79.62 -28.96 22.8)
- LCH
- lch(79.62 36.86 141.8)
- CMYK
- cmyk(29% 0% 28% 17%)
Tints · Shades · Tones
Tints
- A2D8A3
- ACDDAD
- B7E1B7
- C1E6C2
- CCEACC
- D6EED6
- E0F2E0
- EAF7EA
- F5FBF5
Shades
- 83B884
- 6F9D70
- 5C835D
- 49694A
- 375138
- 263A27
- 172417
- 081008
- 010201
Tones
- 95CB97
- 93C394
- 91BA92
- 8FB290
- 8DA98D
- 8AA18B
- 889988
- 859085
- 838883
Color harmonies
Complementary +180°
- 97D499
Young Greens
- E4ABE6
≈ Candy Floss
Analogous -30° +30°
- 97D499
Young Greens
- BFCA7B
≈ Greenish Tan
- 72D8BE
≈ Star Grass
Triadic +120° +240°
- 97D499
Young Greens
- A5C1FF
≈ Pastel Blue
- FEA8A0
≈ Corally
Split-complementary +150° +210°
- 97D499
Young Greens
- C7B5FE
≈ Violet Heaven
- F8A6C5
≈ Rogue Pink
Tetradic +90° +180° +270°
- 97D499
Young Greens
- 7CCDFB
≈ Bubbly Barracuda
- E4ABE6
≈ Candy Floss
- F6B080
≈ Orange Chiffon
Contrast & accessibility
Ag
FailOn white
WCAG 1.72:1 · APCA Lc 31
Ag
AAAOn black
WCAG 12.19:1 · APCA Lc 72
Best text color: #000000
WCAG 12.19:1 (AAA) · APCA Lc 72
Contrast pairs
Code snippets
CSS
:root {
--young-greens: #97d499;
--young-greens-rgb: 151 212 153;
--young-greens-oklch: oklch(0.813 0.103 145.3);
}
.element {
color: var(--young-greens);
background-color: hsl(122 41% 71%);
border-color: oklch(0.813 0.103 145.3);
}Tailwind CSS v4
@theme {
--color-young-greens: #97d499;
--color-young-greens-50: #e3fee5;
--color-young-greens-100: #d2f2d5;
--color-young-greens-200: #b8e1bb;
--color-young-greens-300: #94c699;
--color-young-greens-400: #77af79;
--color-young-greens-500: #57985a;
--color-young-greens-600: #4a814d;
--color-young-greens-700: #3b673d;
--color-young-greens-800: #2b4b2a;
--color-young-greens-900: #1d341c;
--color-young-greens-950: #0d200d;
}SCSS
$young-greens: #97d499;
$young-greens-rgb: 151, 212, 153;
$young-greens-light: mix(#fff, $young-greens, 20%);
$young-greens-dark: mix(#000, $young-greens, 20%);
.element {
color: $young-greens;
box-shadow: 0 0 0 2px rgba($young-greens, 0.35);
}