Nazwany kolor · #02AB2E
Kelley Green
Kelley Green to #02AB2E: rgb(2 171 46), hsl(136 98% 34%), oklch(0.644 0.202 145). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Green mean? → · Kelley Green color name →
#02AB2E
oklch(0.644 0.202 145)
Konwersje koloru
- HEX
- #02ab2e
- RGB
- rgb(2 171 46)
- HSL
- hsl(136 98% 34%)
- HWB
- hwb(136 1% 33%)
- OKLCH
- oklch(0.644 0.202 145)
- OKLab
- oklab(0.644 -0.166 0.116)
- CIE Lab
- lab(61.11 -57.03 49.91)
- LCH
- lch(61.11 75.79 138.8)
- CMYK
- cmyk(99% 0% 73% 33%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 3BB449
- 58BD5F
- 70C674
- 86CE88
- 9BD79C
- B0DFB0
- C4E7C4
- D8EFD7
- EBF7EB
Odcienie ciemniejsze
- 019427
- 017E1F
- 016818
- 005412
- 00400B
- 002D06
- 001B02
- 000B01
- 000100
Tony
- 2AA73C
- 3DA346
- 4A9F50
- 559B58
- 5E9760
- 669367
- 6E8E6E
- 748A74
- 7A857A
Harmonie kolorów
Komplementarna +180°
- 02AB2E
Kelley Green
- C858D0
≈ Thick Pink
Analogowa -30° +30°
- 02AB2E
Kelley Green
- 8C9700
≈ Traffic Light Green
- 00A589
≈ Brilliant Turquoise
Triada +120° +240°
- 02AB2E
Kelley Green
- 5385FF
≈ Skinny Jeans
- F04A4A
≈ Pastel Strawberry
Komplementarna rozszczepiona +150° +210°
- 02AB2E
Kelley Green
- 996CF9
≈ Forgotten Purple
- E54994
≈ Schiaparelli Pink
Tetrada +90° +180° +270°
- 02AB2E
Kelley Green
- 0099D4
≈ Bayern Blue
- C858D0
≈ Thick Pink
- D56E00
≈ Marmalade
Kontrast i dostępność
Ag
FailNa bieli
WCAG 3.05:1 · APCA Lc 57
Ag
AANa czerni
WCAG 6.86:1 · APCA Lc 45
Najlepszy kolor tekstu: #000000
WCAG 6.86:1 (AA) · APCA Lc 45
Contrast pairs
Fragmenty kodu
CSS
:root {
--kelley-green: #02ab2e;
--kelley-green-rgb: 2 171 46;
--kelley-green-oklch: oklch(0.644 0.202 145);
}
.element {
color: var(--kelley-green);
background-color: hsl(136 98% 34%);
border-color: oklch(0.644 0.202 145);
}Tailwind CSS v4
@theme {
--color-kelley-green: #02ab2e;
--color-kelley-green-50: #d0ffd4;
--color-kelley-green-100: #bbfbc1;
--color-kelley-green-200: #98eca1;
--color-kelley-green-300: #67d377;
--color-kelley-green-400: #39bc49;
--color-kelley-green-500: #00a504;
--color-kelley-green-600: #008c0d;
--color-kelley-green-700: #00700c;
--color-kelley-green-800: #005200;
--color-kelley-green-900: #003901;
--color-kelley-green-950: #002300;
}SCSS
$kelley-green: #02ab2e;
$kelley-green-rgb: 2, 171, 46;
$kelley-green-light: mix(#fff, $kelley-green, 20%);
$kelley-green-dark: mix(#000, $kelley-green, 20%);
.element {
color: $kelley-green;
box-shadow: 0 0 0 2px rgba($kelley-green, 0.35);
}