Nazwany kolor · #04F489
Turquoise Green
Turquoise Green to #04F489: rgb(4 244 137), hsl(153 97% 49%), oklch(0.849 0.214 153.9). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Green mean? → · Turquoise Green color name →
#04F489
oklch(0.849 0.214 153.9)
Konwersje koloru
- HEX
- #04f489
- RGB
- rgb(4 244 137)
- HSL
- hsl(153 97% 49%)
- HWB
- hwb(153 2% 4%)
- OKLCH
- oklch(0.849 0.214 153.9)
- OKLab
- oklab(0.849 -0.192 0.094)
- CIE Lab
- lab(85.2 -68.11 37.26)
- LCH
- lch(85.2 77.63 151.3)
- CMYK
- cmyk(98% 0% 44% 4%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 4CF696
- 6CF7A2
- 84F9AE
- 99FABA
- ADFCC5
- BFFDD1
- D0FDDD
- E0FEE8
- F0FFF4
Odcienie ciemniejsze
- 03D476
- 02B564
- 019753
- 017A42
- 005E31
- 004422
- 002B14
- 001407
- 000301
Tony
- 38E889
- 4DDD89
- 5BD188
- 65C588
- 6DBA87
- 73AE86
- 78A385
- 7B9783
- 7E8C82
Harmonie kolorów
Komplementarna +180°
- 04F489
Turquoise Green
- FFAEEF
≈ Pink Wink
Analogowa -30° +30°
- 04F489
Turquoise Green
- B2E300
≈ Akhdhar Green
- 00EDD8
≈ Frozen Boubble
Triada +120° +240°
- 04F489
Turquoise Green
- BECBFF
≈ Light Periwinkle
- FFBAAA
≈ Coral Beach
Komplementarna rozszczepiona +150° +210°
- 04F489
Turquoise Green
- DABFFF
≈ Lavender Fragrance
- FFB6C7
≈ Cherry Blossom Pink
Tetrada +90° +180° +270°
- 04F489
Turquoise Green
- A0D4FF
≈ Malmö FF
- FFAEEF
≈ Pink Wink
- FFBE81
≈ Apricot Flower
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.46:1 · APCA Lc 21
Ag
AAANa czerni
WCAG 14.30:1 · APCA Lc 82
Najlepszy kolor tekstu: #000000
WCAG 14.30:1 (AAA) · APCA Lc 82
Contrast pairs
Fragmenty kodu
CSS
:root {
--turquoise-green: #04f489;
--turquoise-green-rgb: 4 244 137;
--turquoise-green-oklch: oklch(0.849 0.214 153.9);
}
.element {
color: var(--turquoise-green);
background-color: hsl(153 97% 49%);
border-color: oklch(0.849 0.214 153.9);
}Tailwind CSS v4
@theme {
--color-turquoise-green: #04f489;
--color-turquoise-green-50: #c3ffdc;
--color-turquoise-green-100: #acfeca;
--color-turquoise-green-200: #80efad;
--color-turquoise-green-300: #3bd787;
--color-turquoise-green-400: #00c15f;
--color-turquoise-green-500: #00ab37;
--color-turquoise-green-600: #009030;
--color-turquoise-green-700: #007426;
--color-turquoise-green-800: #005515;
--color-turquoise-green-900: #003c0e;
--color-turquoise-green-950: #002502;
}SCSS
$turquoise-green: #04f489;
$turquoise-green-rgb: 4, 244, 137;
$turquoise-green-light: mix(#fff, $turquoise-green, 20%);
$turquoise-green-dark: mix(#000, $turquoise-green, 20%);
.element {
color: $turquoise-green;
box-shadow: 0 0 0 2px rgba($turquoise-green, 0.35);
}