Adlandırılmış renk · #88DDCC
Opulent Turquoise
Opulent Turquoise, #88DDCC: rgb(136 221 204), hsl(168 56% 70%), oklch(0.839 0.087 179.9). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Teal mean? → · Opulent Turquoise color name →
#88DDCC
oklch(0.839 0.087 179.9)
Renk dönüşümleri
- HEX
- #88ddcc
- RGB
- rgb(136 221 204)
- HSL
- hsl(168 56% 70%)
- HWB
- hwb(168 53% 13%)
- OKLCH
- oklch(0.839 0.087 179.9)
- OKLab
- oklab(0.839 -0.087 0)
- CIE Lab
- lab(82.36 -29.87 -0.19)
- LCH
- lch(82.36 29.87 180.4)
- CMYK
- cmyk(38% 0% 8% 13%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- 95E1D1
- A2E4D6
- AEE8DB
- BBEBE0
- C6EEE5
- D2F2EA
- DDF5EF
- E9F8F5
- F4FCFA
Koyu tonlar
- 75C0B1
- 63A497
- 52887E
- 416E65
- 31554E
- 223D37
- 132622
- 06110F
- 010202
Gri tonlar
- 89D3C4
- 89CABC
- 89C0B5
- 88B7AD
- 87AEA5
- 86A49E
- 859B96
- 84928F
- 828987
Renk uyumları
Tamamlayıcı +180°
- 88DDCC
Opulent Turquoise
- FAB3C8
≈ Love Spell
Analog -30° +30°
- 88DDCC
Opulent Turquoise
- A2DAAC
≈ Green Trance
- 83DAE9
≈ Medium Sky Blue
Üçlü +120° +240°
- 88DDCC
Opulent Turquoise
- D2BEFB
≈ Lavender Tonic
- F5BD91
≈ Persimmon Fade
Bölünmüş tamamlayıcı +150° +210°
- 88DDCC
Opulent Turquoise
- EBB6E5
≈ Pink Drink
- FEB5A9
≈ Washed-Out Crimson
Dörtlü +90° +180° +270°
- 88DDCC
Opulent Turquoise
- B6C8FF
≈ Light Periwinkle
- FAB3C8
≈ Love Spell
- E0C888
≈ 24 Karat
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 1.58:1 · APCA Lc 26
Ag
AAASiyah üzerinde
WCAG 13.26:1 · APCA Lc 77
En iyi metin rengi: #000000
WCAG 13.26:1 (AAA) · APCA Lc 77
Contrast pairs
Kod parçacıkları
CSS
:root {
--opulent-turquoise: #88ddcc;
--opulent-turquoise-rgb: 136 221 204;
--opulent-turquoise-oklch: oklch(0.839 0.087 179.9);
}
.element {
color: var(--opulent-turquoise);
background-color: hsl(168 56% 70%);
border-color: oklch(0.839 0.087 179.9);
}Tailwind CSS v4
@theme {
--color-opulent-turquoise: #88ddcc;
--color-opulent-turquoise-50: #dbfef7;
--color-opulent-turquoise-100: #c9f2ea;
--color-opulent-turquoise-200: #ace1d7;
--color-opulent-turquoise-300: #84c6bb;
--color-opulent-turquoise-400: #60afa0;
--color-opulent-turquoise-500: #359988;
--color-opulent-turquoise-600: #2f8173;
--color-opulent-turquoise-700: #25675c;
--color-opulent-turquoise-800: #1a4c42;
--color-opulent-turquoise-900: #11352e;
--color-opulent-turquoise-950: #03201b;
}SCSS
$opulent-turquoise: #88ddcc;
$opulent-turquoise-rgb: 136, 221, 204;
$opulent-turquoise-light: mix(#fff, $opulent-turquoise, 20%);
$opulent-turquoise-dark: mix(#000, $opulent-turquoise, 20%);
.element {
color: $opulent-turquoise;
box-shadow: 0 0 0 2px rgba($opulent-turquoise, 0.35);
}