Named color · #00BB55
Pistou Green
Pistou Green is #00BB55: rgb(0 187 85), hsl(147 100% 37%), oklch(0.692 0.192 149.7). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Green mean? → · Pistou Green color name →
#00BB55
oklch(0.692 0.192 149.7)
Color conversions
- HEX
- #00bb55
- RGB
- rgb(0 187 85)
- HSL
- hsl(147 100% 37%)
- HWB
- hwb(147 0% 27%)
- OKLCH
- oklch(0.692 0.192 149.7)
- OKLab
- oklab(0.692 -0.166 0.097)
- CIE Lab
- lab(66.65 -58.15 39.38)
- LCH
- lch(66.65 70.23 145.9)
- CMYK
- cmyk(100% 0% 55% 27%)
Tints · Shades · Tones
Tints
- 3FC267
- 5DCA79
- 75D18A
- 8BD89A
- 9FDFAB
- B3E5BC
- C7ECCD
- DAF2DD
- ECF9EE
Shades
- 00A249
- 008A3D
- 007331
- 005C26
- 00461C
- 003211
- 001F08
- 000D02
- 000200
Tones
- 2DB55B
- 40B060
- 4EAA65
- 59A46A
- 629E6E
- 699972
- 709376
- 768D7A
- 7B867D
Color harmonies
Complementary +180°
- 00BB55
Pistou Green
- DB68D4
≈ Pink Orchid
Analogous -30° +30°
- 00BB55
Pistou Green
- 90A900
≈ Augustus Asparagus
- 00B59F
≈ Aare River
Triadic +120° +240°
- 00BB55
Pistou Green
- 7594FF
≈ Blue Chaos
- FC624F
≈ Rose Fusion
Split-complementary +150° +210°
- 00BB55
Pistou Green
- AF7BFF
≈ Purple Illusionist
- F55E98
≈ Medium Pink
Tetradic +90° +180° +270°
- 00BB55
Pistou Green
- 00A6F3
≈ Rockman Blue
- DB68D4
≈ Pink Orchid
- E37F00
≈ Sports Fan
Contrast & accessibility
Ag
FailOn white
WCAG 2.54:1 · APCA Lc 49
Ag
AAAOn black
WCAG 8.23:1 · APCA Lc 53
Best text color: #000000
WCAG 8.23:1 (AAA) · APCA Lc 53
Contrast pairs
Code snippets
CSS
:root {
--pistou-green: #00bb55;
--pistou-green-rgb: 0 187 85;
--pistou-green-oklch: oklch(0.692 0.192 149.7);
}
.element {
color: var(--pistou-green);
background-color: hsl(147 100% 37%);
border-color: oklch(0.692 0.192 149.7);
}Tailwind CSS v4
@theme {
--color-pistou-green: #00bb55;
--color-pistou-green-50: #cdffda;
--color-pistou-green-100: #b8fbc8;
--color-pistou-green-200: #93ecab;
--color-pistou-green-300: #60d385;
--color-pistou-green-400: #26bc5c;
--color-pistou-green-500: #00a633;
--color-pistou-green-600: #008c2d;
--color-pistou-green-700: #007124;
--color-pistou-green-800: #005314;
--color-pistou-green-900: #003a0c;
--color-pistou-green-950: #002401;
}SCSS
$pistou-green: #00bb55;
$pistou-green-rgb: 0, 187, 85;
$pistou-green-light: mix(#fff, $pistou-green, 20%);
$pistou-green-dark: mix(#000, $pistou-green, 20%);
.element {
color: $pistou-green;
box-shadow: 0 0 0 2px rgba($pistou-green, 0.35);
}