Nazwany kolor · #35B76D
Turtle Warrior
Turtle Warrior to #35B76D: rgb(53 183 109), hsl(146 55% 46%), oklch(0.692 0.156 153.7). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Green mean? → · Turtle Warrior color name →
#35B76D
oklch(0.692 0.156 153.7)
Konwersje koloru
- HEX
- #35b76d
- RGB
- rgb(53 183 109)
- HSL
- hsl(146 55% 46%)
- HWB
- hwb(146 21% 28%)
- OKLCH
- oklch(0.692 0.156 153.7)
- OKLab
- oklab(0.692 -0.14 0.069)
- CIE Lab
- lab(66.26 -49.16 27.13)
- LCH
- lch(66.26 56.15 151.1)
- CMYK
- cmyk(71% 0% 40% 28%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 52BF7B
- 6AC68A
- 7FCD98
- 92D5A7
- A5DCB5
- B8E3C4
- CAEAD2
- DCF1E1
- EDF8F0
Odcienie ciemniejsze
- 2D9F5E
- 25874F
- 1D7041
- 155A33
- 0E4526
- 083119
- 031E0D
- 010C04
- 000201
Tony
- 44B26F
- 50AC72
- 59A774
- 61A276
- 689C78
- 6E977A
- 73917C
- 788B7D
- 7C867F
Harmonie kolorów
Komplementarna +180°
- 35B76D
Turtle Warrior
- D474C4
≈ Purple Kush
Analogowa -30° +30°
- 35B76D
Turtle Warrior
- 89AB29
≈ German Hop
- 00B4A4
≈ Glass Jar Blue
Triada +120° +240°
- 35B76D
Turtle Warrior
- 7E92FB
≈ Lavender Blue Shadow
- EC7358
≈ Bloodletter
Komplementarna rozszczepiona +150° +210°
- 35B76D
Turtle Warrior
- B181EA
≈ Lavender Blossom
- E86D91
≈ Loveland
Tetrada +90° +180° +270°
- 35B76D
Turtle Warrior
- 2AA4F4
≈ Rockman Blue
- D474C4
≈ Purple Kush
- DD8306
≈ Tangerine Haze
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.57:1 · APCA Lc 50
Ag
AAANa czerni
WCAG 8.14:1 · APCA Lc 52
Najlepszy kolor tekstu: #000000
WCAG 8.14:1 (AAA) · APCA Lc 52
Contrast pairs
Fragmenty kodu
CSS
:root {
--turtle-warrior: #35b76d;
--turtle-warrior-rgb: 53 183 109;
--turtle-warrior-oklch: oklch(0.692 0.156 153.7);
}
.element {
color: var(--turtle-warrior);
background-color: hsl(146 55% 46%);
border-color: oklch(0.692 0.156 153.7);
}Tailwind CSS v4
@theme {
--color-turtle-warrior: #35b76d;
--color-turtle-warrior-50: #d2ffe3;
--color-turtle-warrior-100: #bef8d2;
--color-turtle-warrior-200: #9de9b8;
--color-turtle-warrior-300: #6fcf95;
--color-turtle-warrior-400: #42b872;
--color-turtle-warrior-500: #00a252;
--color-turtle-warrior-600: #008946;
--color-turtle-warrior-700: #006e38;
--color-turtle-warrior-800: #005125;
--color-turtle-warrior-900: #023819;
--color-turtle-warrior-950: #002309;
}SCSS
$turtle-warrior: #35b76d;
$turtle-warrior-rgb: 53, 183, 109;
$turtle-warrior-light: mix(#fff, $turtle-warrior, 20%);
$turtle-warrior-dark: mix(#000, $turtle-warrior, 20%);
.element {
color: $turtle-warrior;
box-shadow: 0 0 0 2px rgba($turtle-warrior, 0.35);
}