Named color · #9C8B1F
Offbeat Green
Offbeat Green is #9C8B1F: rgb(156 139 31), hsl(52 67% 37%), oklch(0.633 0.122 99.7). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Yellow mean? → · Offbeat Green color name →
#9C8B1F
oklch(0.633 0.122 99.7)
Color conversions
- HEX
- #9c8b1f
- RGB
- rgb(156 139 31)
- HSL
- hsl(52 67% 37%)
- HWB
- hwb(52 12% 39%)
- OKLCH
- oklch(0.633 0.122 99.7)
- OKLab
- oklab(0.633 -0.021 0.12)
- CIE Lab
- lab(58.03 -1.81 55.02)
- LCH
- lch(58.03 55.05 91.9)
- CMYK
- cmyk(0% 11% 80% 39%)
Tints · Shades · Tones
Tints
- A5963F
- AFA257
- B8AD6D
- C2B982
- CCC597
- D6D0AC
- E0DCC1
- EAE7D5
- F5F3EA
Shades
- 877819
- 736614
- 5F540F
- 4C430A
- 393206
- 282303
- 181401
- 090700
- 010100
Tones
- 998A31
- 96893E
- 938849
- 908752
- 8E865B
- 8B8563
- 88846B
- 858372
- 838179
Color harmonies
Complementary +180°
- 9C8B1F
Offbeat Green
- 7C81D2
≈ Tanzine
Analogous -30° +30°
- 9C8B1F
Offbeat Green
- B97B28
≈ Mandalay
- 729844
≈ Lattice Green
Triadic +120° +240°
- 9C8B1F
Offbeat Green
- 009ABA
≈ Serene Blue
- BA6BA2
≈ Pearly Purple
Split-complementary +150° +210°
- 9C8B1F
Offbeat Green
- 4A8FD1
≈ Blue Dart
- A174C1
≈ Purple Pride
Tetradic +90° +180° +270°
- 9C8B1F
Offbeat Green
- 009F98
≈ Spectra Green
- 7C81D2
≈ Tanzine
- C8687A
≈ Lovebirds
Contrast & accessibility
Ag
FailOn white
WCAG 3.42:1 · APCA Lc 62
Ag
AAOn black
WCAG 6.12:1 · APCA Lc 40
Best text color: #000000
WCAG 6.12:1 (AA) · APCA Lc 40
Contrast pairs
Code snippets
CSS
:root {
--offbeat-green: #9c8b1f;
--offbeat-green-rgb: 156 139 31;
--offbeat-green-oklch: oklch(0.633 0.122 99.7);
}
.element {
color: var(--offbeat-green);
background-color: hsl(52 67% 37%);
border-color: oklch(0.633 0.122 99.7);
}Tailwind CSS v4
@theme {
--color-offbeat-green: #9c8b1f;
--color-offbeat-green-50: #fcf7cf;
--color-offbeat-green-100: #f0eabb;
--color-offbeat-green-200: #ded79a;
--color-offbeat-green-300: #c4ba6e;
--color-offbeat-green-400: #b0a041;
--color-offbeat-green-500: #9a8700;
--color-offbeat-green-600: #827200;
--color-offbeat-green-700: #685b00;
--color-offbeat-green-800: #4e4200;
--color-offbeat-green-900: #362e01;
--color-offbeat-green-950: #211a00;
}SCSS
$offbeat-green: #9c8b1f;
$offbeat-green-rgb: 156, 139, 31;
$offbeat-green-light: mix(#fff, $offbeat-green, 20%);
$offbeat-green-dark: mix(#000, $offbeat-green, 20%);
.element {
color: $offbeat-green;
box-shadow: 0 0 0 2px rgba($offbeat-green, 0.35);
}