Adlandırılmış renk · #55AAAA
Emerald Succulent
Emerald Succulent, #55AAAA: rgb(85 170 170), hsl(180 33% 50%), oklch(0.685 0.082 195.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? → · Emerald Succulent color name →
#55AAAA
oklch(0.685 0.082 195.4)
Renk dönüşümleri
- HEX
- #55aaaa
- RGB
- rgb(85 170 170)
- HSL
- hsl(180 33% 50%)
- HWB
- hwb(180 33% 33%)
- OKLCH
- oklch(0.685 0.082 195.4)
- OKLab
- oklab(0.685 -0.079 -0.022)
- CIE Lab
- lab(64.38 -26.83 -8.37)
- LCH
- lch(64.38 28.11 197.3)
- CMYK
- cmyk(50% 0% 0% 33%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- 68B2B2
- 7ABBBB
- 8CC3C3
- 9DCCCB
- ADD4D4
- BEDDDC
- CEE5E5
- DEEEEE
- EFF6F6
Koyu tonlar
- 499393
- 3D7D7D
- 316868
- 265353
- 1C3F3F
- 112D2D
- 081B1B
- 020B0B
- 000101
Gri tonlar
- 5CA6A6
- 62A2A1
- 679E9D
- 6C9999
- 709595
- 749191
- 778D8C
- 7A8988
- 7D8484
Renk uyumları
Tamamlayıcı +180°
- 55AAAA
Emerald Succulent
- C88589
≈ All’s Ace
Analog -30° +30°
- 55AAAA
Emerald Succulent
- 66AA8E
≈ Artemesia Green
- 5EA5C1
≈ Surgical
Üçlü +120° +240°
- 55AAAA
Emerald Succulent
- AE8BBD
≈ East Side
- B8935F
≈ Barley Corn
Bölünmüş tamamlayıcı +150° +210°
- 55AAAA
Emerald Succulent
- BF85A5
≈ Rosy
- C58A6F
≈ Secluded Canyon
Dörtlü +90° +180° +270°
- 55AAAA
Emerald Succulent
- 9593CB
≈ Litmus
- C88589
≈ All’s Ace
- A19D60
≈ Zandri Dust
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 2.72:1 · APCA Lc 53
Ag
AAASiyah üzerinde
WCAG 7.71:1 · APCA Lc 49
En iyi metin rengi: #000000
WCAG 7.71:1 (AAA) · APCA Lc 49
Contrast pairs
Kod parçacıkları
CSS
:root {
--emerald-succulent: #55aaaa;
--emerald-succulent-rgb: 85 170 170;
--emerald-succulent-oklch: oklch(0.685 0.082 195.4);
}
.element {
color: var(--emerald-succulent);
background-color: hsl(180 33% 50%);
border-color: oklch(0.685 0.082 195.4);
}Tailwind CSS v4
@theme {
--color-emerald-succulent: #55aaaa;
--color-emerald-succulent-50: #dbfdfd;
--color-emerald-succulent-100: #c9f1f1;
--color-emerald-succulent-200: #ace0e0;
--color-emerald-succulent-300: #84c5c6;
--color-emerald-succulent-400: #5faeae;
--color-emerald-succulent-500: #329797;
--color-emerald-succulent-600: #2d8080;
--color-emerald-succulent-700: #246666;
--color-emerald-succulent-800: #184b4a;
--color-emerald-succulent-900: #103434;
--color-emerald-succulent-950: #02201f;
}SCSS
$emerald-succulent: #55aaaa;
$emerald-succulent-rgb: 85, 170, 170;
$emerald-succulent-light: mix(#fff, $emerald-succulent, 20%);
$emerald-succulent-dark: mix(#000, $emerald-succulent, 20%);
.element {
color: $emerald-succulent;
box-shadow: 0 0 0 2px rgba($emerald-succulent, 0.35);
}