Adlandırılmış renk · #4DBBAF
Tropical Escape
Tropical Escape, #4DBBAF: rgb(77 187 175), hsl(173 45% 52%), oklch(0.726 0.102 185.4). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Teal mean? → · Tropical Escape color name →
#4DBBAF
oklch(0.726 0.102 185.4)
Renk dönüşümleri
- HEX
- #4dbbaf
- RGB
- rgb(77 187 175)
- HSL
- hsl(173 45% 52%)
- HWB
- hwb(173 30% 27%)
- OKLCH
- oklch(0.726 0.102 185.4)
- OKLab
- oklab(0.726 -0.101 -0.01)
- CIE Lab
- lab(69.38 -34.93 -3.84)
- LCH
- lch(69.38 35.14 186.3)
- CMYK
- cmyk(59% 0% 6% 27%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- 64C2B7
- 78C9BF
- 8AD0C6
- 9CD7CE
- ADDDD6
- BEE4DE
- CEEBE6
- DFF2EF
- EFF8F7
Koyu tonlar
- 42A298
- 378A81
- 2C736B
- 225C56
- 184641
- 0F322E
- 071F1C
- 020D0B
- 000201
Gri tonlar
- 56B5AA
- 5EAFA5
- 65A9A1
- 6AA39C
- 6F9E97
- 749892
- 77928E
- 7B8C89
- 7E8685
Renk uyumları
Tamamlayıcı +180°
- 4DBBAF
Tropical Escape
- DD8B9D
≈ Reflecting Rose
Analog -30° +30°
- 4DBBAF
Tropical Escape
- 6FB98B
≈ Garden Variety
- 4DB6CE
≈ Teal Moiré
Üçlü +120° +240°
- 4DBBAF
Tropical Escape
- B596DA
≈ Lenurple
- D2995F
≈ Butternut Tree
Bölünmüş tamamlayıcı +150° +210°
- 4DBBAF
Tropical Escape
- CE8EBF
≈ Pomtini
- DE8F7A
≈ Nude Flamingo
Dörtlü +90° +180° +270°
- 4DBBAF
Tropical Escape
- 94A1E6
≈ Cold Lips
- DD8B9D
≈ Reflecting Rose
- BAA658
≈ Yellow Maize
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 2.32:1 · APCA Lc 46
Ag
AAASiyah üzerinde
WCAG 9.04:1 · APCA Lc 57
En iyi metin rengi: #000000
WCAG 9.04:1 (AAA) · APCA Lc 57
Contrast pairs
Kod parçacıkları
CSS
:root {
--tropical-escape: #4dbbaf;
--tropical-escape-rgb: 77 187 175;
--tropical-escape-oklch: oklch(0.726 0.102 185.4);
}
.element {
color: var(--tropical-escape);
background-color: hsl(173 45% 52%);
border-color: oklch(0.726 0.102 185.4);
}Tailwind CSS v4
@theme {
--color-tropical-escape: #4dbbaf;
--color-tropical-escape-50: #d6fffa;
--color-tropical-escape-100: #c2f4ee;
--color-tropical-escape-200: #a2e3dc;
--color-tropical-escape-300: #77c9c0;
--color-tropical-escape-400: #4bb2a7;
--color-tropical-escape-500: #009b8f;
--color-tropical-escape-600: #018379;
--color-tropical-escape-700: #056961;
--color-tropical-escape-800: #044e46;
--color-tropical-escape-900: #043630;
--color-tropical-escape-950: #00211d;
}SCSS
$tropical-escape: #4dbbaf;
$tropical-escape-rgb: 77, 187, 175;
$tropical-escape-light: mix(#fff, $tropical-escape, 20%);
$tropical-escape-dark: mix(#000, $tropical-escape, 20%);
.element {
color: $tropical-escape;
box-shadow: 0 0 0 2px rgba($tropical-escape, 0.35);
}