Named color · #A9B062
April Green
April Green is #A9B062: rgb(169 176 98), hsl(65 33% 54%), oklch(0.734 0.102 113.1). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Yellow mean? → · April Green color name →
#A9B062
oklch(0.734 0.102 113.1)
Color conversions
- HEX
- #a9b062
- RGB
- rgb(169 176 98)
- HSL
- hsl(65 33% 54%)
- HWB
- hwb(65 38% 31%)
- OKLCH
- oklch(0.734 0.102 113.1)
- OKLab
- oklab(0.734 -0.04 0.094)
- CIE Lab
- lab(69.96 -11.26 38.85)
- LCH
- lch(69.96 40.44 106.2)
- CMYK
- cmyk(4% 0% 44% 31%)
Tints · Shades · Tones
Tints
- B1B873
- B9C083
- C2C892
- CAD0A2
- D3D7B1
- DBDFC1
- E4E7D0
- EDEFE0
- F6F7EF
Shades
- 929954
- 7C8247
- 676C3A
- 53562D
- 3F4221
- 2C2E16
- 1B1C0B
- 0A0B03
- 010100
Tones
- A5AB66
- A0A66A
- 9CA26E
- 989D71
- 949874
- 909377
- 8C8E79
- 888A7C
- 84857E
Color harmonies
Complementary +180°
- A9B062
April Green
- AB9DE4
≈ Dull Lavender
Analogous -30° +30°
- A9B062
April Green
- C8A35A
≈ Winter Pear Beige
- 82BA7F
≈ Flashman
Triadic +120° +240°
- A9B062
April Green
- 61B4DF
≈ Sea Frolic
- DB8EAE
≈ Berry Twist
Split-complementary +150° +210°
- A9B062
April Green
- 87A9EA
≈ Queer Blue
- C893CE
≈ Rose Souvenir
Tetradic +90° +180° +270°
- A9B062
April Green
- 4ABCC5
≈ Sussie
- AB9DE4
≈ Dull Lavender
- E28F8B
≈ Honeysuckle Rose
Contrast & accessibility
Ag
FailOn white
WCAG 2.31:1 · APCA Lc 46
Ag
AAAOn black
WCAG 9.07:1 · APCA Lc 56
Best text color: #000000
WCAG 9.07:1 (AAA) · APCA Lc 56
Contrast pairs
Code snippets
CSS
:root {
--april-green: #a9b062;
--april-green-rgb: 169 176 98;
--april-green-oklch: oklch(0.734 0.102 113.1);
}
.element {
color: var(--april-green);
background-color: hsl(65 33% 54%);
border-color: oklch(0.734 0.102 113.1);
}Tailwind CSS v4
@theme {
--color-april-green: #a9b062;
--color-april-green-50: #f4f9d8;
--color-april-green-100: #e6edc6;
--color-april-green-200: #d2daa8;
--color-april-green-300: #b5be81;
--color-april-green-400: #9ea55c;
--color-april-green-500: #878d34;
--color-april-green-600: #72772e;
--color-april-green-700: #5b6024;
--color-april-green-800: #444617;
--color-april-green-900: #2f300f;
--color-april-green-950: #1b1c03;
}SCSS
$april-green: #a9b062;
$april-green-rgb: 169, 176, 98;
$april-green-light: mix(#fff, $april-green, 20%);
$april-green-dark: mix(#000, $april-green, 20%);
.element {
color: $april-green;
box-shadow: 0 0 0 2px rgba($april-green, 0.35);
}