Named color · #44DD66
Hello Spring
Hello Spring is #44DD66: rgb(68 221 102), hsl(133 69% 57%), oklch(0.792 0.206 147.2). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Green mean? → · Hello Spring color name →
#44DD66
oklch(0.792 0.206 147.2)
Color conversions
- HEX
- #44dd66
- RGB
- rgb(68 221 102)
- HSL
- hsl(133 69% 57%)
- HWB
- hwb(133 27% 13%)
- OKLCH
- oklch(0.792 0.206 147.2)
- OKLab
- oklab(0.792 -0.173 0.112)
- CIE Lab
- lab(78.42 -59.84 45.63)
- LCH
- lch(78.42 75.25 142.7)
- CMYK
- cmyk(69% 0% 54% 13%)
Tints · Shades · Tones
Tints
- 60E177
- 77E587
- 8BE997
- 9EECA6
- AFF0B5
- C0F3C4
- D0F6D3
- E0F9E2
- F0FCF0
Shades
- 3AC058
- 30A44A
- 26883C
- 1D6E2F
- 145523
- 0C3D17
- 05260C
- 021104
- 000200
Tones
- 52D46B
- 5CCA6F
- 64C172
- 6BB875
- 70AF78
- 75A57A
- 799C7C
- 7C937D
- 7E897F
Color harmonies
Complementary +180°
- 44DD66
Hello Spring
- FE85FF
≈ Bubblegum
Analogous -30° +30°
- 44DD66
Hello Spring
- B4C900
≈ Chartreuse Spark
- 00D9BA
≈ Channel Marker Green
Triadic +120° +240°
- 44DD66
Hello Spring
- 9DB9FF
≈ Truesky Gloxym
- FF9C91
≈ Peach Pink
Split-complementary +150° +210°
- 44DD66
Hello Spring
- C4ABFF
≈ Purple Hepatica
- FF96BC
≈ Saira Red
Tetradic +90° +180° +270°
- 44DD66
Hello Spring
- 68C6FF
≈ Maya Blue
- FE85FF
≈ Bubblegum
- FFA258
≈ Off-The-Leash Orange
Contrast & accessibility
Ag
FailOn white
WCAG 1.78:1 · APCA Lc 32
Ag
AAAOn black
WCAG 11.78:1 · APCA Lc 70
Best text color: #000000
WCAG 11.78:1 (AAA) · APCA Lc 70
Contrast pairs
Code snippets
CSS
:root {
--hello-spring: #44dd66;
--hello-spring-rgb: 68 221 102;
--hello-spring-oklch: oklch(0.792 0.206 147.2);
}
.element {
color: var(--hello-spring);
background-color: hsl(133 69% 57%);
border-color: oklch(0.792 0.206 147.2);
}Tailwind CSS v4
@theme {
--color-hello-spring: #44dd66;
--color-hello-spring-50: #cdffd6;
--color-hello-spring-100: #b7fcc3;
--color-hello-spring-200: #92eda4;
--color-hello-spring-300: #5ed47b;
--color-hello-spring-400: #25bd4e;
--color-hello-spring-500: #00a717;
--color-hello-spring-600: #008d18;
--color-hello-spring-700: #007114;
--color-hello-spring-800: #005304;
--color-hello-spring-900: #003a04;
--color-hello-spring-950: #002400;
}SCSS
$hello-spring: #44dd66;
$hello-spring-rgb: 68, 221, 102;
$hello-spring-light: mix(#fff, $hello-spring, 20%);
$hello-spring-dark: mix(#000, $hello-spring, 20%);
.element {
color: $hello-spring;
box-shadow: 0 0 0 2px rgba($hello-spring, 0.35);
}