Nazwany kolor · #36B14E
Spandex Green
Spandex Green to #36B14E: rgb(54 177 78), hsl(132 53% 45%), oklch(0.671 0.176 146.6). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Green mean? → · Spandex Green color name →
#36B14E
oklch(0.671 0.176 146.6)
Konwersje koloru
- HEX
- #36b14e
- RGB
- rgb(54 177 78)
- HSL
- hsl(132 53% 45%)
- HWB
- hwb(132 21% 31%)
- OKLCH
- oklch(0.671 0.176 146.6)
- OKLab
- oklab(0.671 -0.147 0.097)
- CIE Lab
- lab(64 -50.68 39.75)
- LCH
- lch(64 64.41 141.9)
- CMYK
- cmyk(69% 0% 56% 31%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 52B961
- 69C173
- 7DC985
- 91D196
- A4D9A8
- B6E1B9
- C9E9CA
- DBF0DC
- EDF8ED
Odcienie ciemniejsze
- 2E9943
- 258338
- 1E6C2D
- 165723
- 0F4219
- 082F0F
- 031C07
- 010C02
- 000100
Tony
- 44AC55
- 4FA85B
- 58A361
- 609E66
- 67996B
- 6D9570
- 729074
- 778A78
- 7C857C
Harmonie kolorów
Komplementarna +180°
- 36B14E
Spandex Green
- CC69CE
≈ Purple Urn Orchid
Analogowa -30° +30°
- 36B14E
Spandex Green
- 91A000
≈ Noxious
- 00AE94
≈ Hobgoblin
Triada +120° +240°
- 36B14E
Spandex Green
- 658EFF
≈ Punch Out Glove
- EE6258
≈ Flattered Flamingo
Komplementarna rozszczepiona +150° +210°
- 36B14E
Spandex Green
- A27AF3
≈ Forgotten Purple
- E65F98
≈ Carmine Rose
Tetrada +90° +180° +270°
- 36B14E
Spandex Green
- 00A1E3
≈ Vanadyl Blue
- CC69CE
≈ Purple Urn Orchid
- DE7600
≈ Orange Outburst
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.77:1 · APCA Lc 53
Ag
AAANa czerni
WCAG 7.55:1 · APCA Lc 49
Najlepszy kolor tekstu: #000000
WCAG 7.55:1 (AAA) · APCA Lc 49
Contrast pairs
Fragmenty kodu
CSS
:root {
--spandex-green: #36b14e;
--spandex-green-rgb: 54 177 78;
--spandex-green-oklch: oklch(0.671 0.176 146.6);
}
.element {
color: var(--spandex-green);
background-color: hsl(132 53% 45%);
border-color: oklch(0.671 0.176 146.6);
}Tailwind CSS v4
@theme {
--color-spandex-green: #36b14e;
--color-spandex-green-50: #d3ffda;
--color-spandex-green-100: #c0f9c8;
--color-spandex-green-200: #9fe9aa;
--color-spandex-green-300: #72d084;
--color-spandex-green-400: #49b95b;
--color-spandex-green-500: #00a333;
--color-spandex-green-600: #008a2d;
--color-spandex-green-700: #026e23;
--color-spandex-green-800: #0a5114;
--color-spandex-green-900: #07380d;
--color-spandex-green-950: #002301;
}SCSS
$spandex-green: #36b14e;
$spandex-green-rgb: 54, 177, 78;
$spandex-green-light: mix(#fff, $spandex-green, 20%);
$spandex-green-dark: mix(#000, $spandex-green, 20%);
.element {
color: $spandex-green;
box-shadow: 0 0 0 2px rgba($spandex-green, 0.35);
}