Adlandırılmış renk · #77CABD
Hawaiian Vacation
Hawaiian Vacation, #77CABD: rgb(119 202 189), hsl(171 44% 63%), oklch(0.782 0.084 183). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Teal mean? → · Hawaiian Vacation color name →
#77CABD
oklch(0.782 0.084 183)
Renk dönüşümleri
- HEX
- #77cabd
- RGB
- rgb(119 202 189)
- HSL
- hsl(171 44% 63%)
- HWB
- hwb(171 47% 21%)
- OKLCH
- oklch(0.782 0.084 183)
- OKLab
- oklab(0.782 -0.084 -0.004)
- CIE Lab
- lab(75.78 -28.79 -1.87)
- LCH
- lch(75.78 28.85 183.7)
- CMYK
- cmyk(41% 0% 6% 21%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- 86CFC3
- 95D5CA
- A3DAD0
- B0DFD7
- BEE5DE
- CBEAE4
- D8EFEB
- E5F5F2
- F2FAF8
Koyu tonlar
- 67AFA4
- 57958C
- 477C74
- 38645D
- 2A4D47
- 1C3733
- 10221F
- 050F0D
- 010202
Gri tonlar
- 79C2B7
- 7BBBB0
- 7DB3AA
- 7EACA4
- 7FA59E
- 809D98
- 809692
- 818F8C
- 808786
Renk uyumları
Tamamlayıcı +180°
- 77CABD
Hawaiian Vacation
- E6A2B3
≈ Sprinkled With Pink
Analog -30° +30°
- 77CABD
Hawaiian Vacation
- 8FC89F
≈ Frost Gum
- 75C7D8
≈ Betsy
Üçlü +120° +240°
- 77CABD
Hawaiian Vacation
- C3ACE5
≈ Perfume
- DFAD80
≈ Manhattan
Bölünmüş tamamlayıcı +150° +210°
- 77CABD
Hawaiian Vacation
- D9A5CF
≈ Tiara Pink
- E9A596
≈ Spring Linen
Dörtlü +90° +180° +270°
- 77CABD
Hawaiian Vacation
- A6B5EE
≈ Wondrous Wisteria
- E6A2B3
≈ Sprinkled With Pink
- CAB779
≈ Olive Marinade
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 1.91:1 · APCA Lc 36
Ag
AAASiyah üzerinde
WCAG 10.96:1 · APCA Lc 66
En iyi metin rengi: #000000
WCAG 10.96:1 (AAA) · APCA Lc 66
Contrast pairs
Kod parçacıkları
CSS
:root {
--hawaiian-vacation: #77cabd;
--hawaiian-vacation-rgb: 119 202 189;
--hawaiian-vacation-oklch: oklch(0.782 0.084 183);
}
.element {
color: var(--hawaiian-vacation);
background-color: hsl(171 44% 63%);
border-color: oklch(0.782 0.084 183);
}Tailwind CSS v4
@theme {
--color-hawaiian-vacation: #77cabd;
--color-hawaiian-vacation-50: #dcfef8;
--color-hawaiian-vacation-100: #caf2eb;
--color-hawaiian-vacation-200: #ade0d9;
--color-hawaiian-vacation-300: #85c6bd;
--color-hawaiian-vacation-400: #61afa3;
--color-hawaiian-vacation-500: #37988b;
--color-hawaiian-vacation-600: #308176;
--color-hawaiian-vacation-700: #26675e;
--color-hawaiian-vacation-800: #1b4c44;
--color-hawaiian-vacation-900: #12352f;
--color-hawaiian-vacation-950: #03201b;
}SCSS
$hawaiian-vacation: #77cabd;
$hawaiian-vacation-rgb: 119, 202, 189;
$hawaiian-vacation-light: mix(#fff, $hawaiian-vacation, 20%);
$hawaiian-vacation-dark: mix(#000, $hawaiian-vacation, 20%);
.element {
color: $hawaiian-vacation;
box-shadow: 0 0 0 2px rgba($hawaiian-vacation, 0.35);
}