Couleur nommée · #82D9C5
Tender Turquoise
Tender Turquoise correspond à #82D9C5 : rgb(130 217 197), hsl(166 53% 68%), oklch(0.825 0.09 177.6). Teintes, ombres, harmonies, contraste WCAG et APCA, et code CSS, Tailwind v4 et SCSS.
What does Teal mean? → · Tender Turquoise color name →
#82D9C5
oklch(0.825 0.09 177.6)
Conversions de couleur
- HEX
- #82d9c5
- RGB
- rgb(130 217 197)
- HSL
- hsl(166 53% 68%)
- HWB
- hwb(166 51% 15%)
- OKLCH
- oklch(0.825 0.09 177.6)
- OKLab
- oklab(0.825 -0.089 0.004)
- CIE Lab
- lab(80.79 -30.97 1.19)
- LCH
- lch(80.79 30.99 177.8)
- CMYK
- cmyk(40% 0% 9% 15%)
Teintes · Ombres · Tons
Teintes
- 90DDCB
- 9EE1D0
- ABE5D6
- B7E9DC
- C4ECE2
- D0F0E7
- DCF4ED
- E8F8F3
- F3FBF9
Ombres
- 70BCAB
- 5FA192
- 4E8679
- 3E6C61
- 2F534B
- 203B35
- 122521
- 06110E
- 010202
Tons
- 83D0BE
- 84C7B7
- 85BEB0
- 85B5A9
- 85ACA2
- 84A39B
- 849A94
- 83918D
- 818987
Harmonies de couleurs
Complémentaire +180°
- 82D9C5
Tender Turquoise
- F6AEC6
≈ Nadeshiko Pink
Analogue -30° +30°
- 82D9C5
Tender Turquoise
- 9ED6A5
≈ Green Trance
- 7AD6E3
≈ Middle Blue
Triadique +120° +240°
- 82D9C5
Tender Turquoise
- CCBAF9
≈ Violet Heaven
- F2B78C
≈ Melón Meloso
Complémentaire divisée +150° +210°
- 82D9C5
Tender Turquoise
- E6B1E4
≈ Land of Dreams
- FAB0A6
≈ Riviera Rose
Tétradique +90° +180° +270°
- 82D9C5
Tender Turquoise
- ADC4FF
≈ Pastel Blue
- F6AEC6
≈ Nadeshiko Pink
- DEC381
≈ Chalky
Contraste et accessibilité
Ag
FailSur blanc
WCAG 1.65:1 · APCA Lc 29
Ag
AAASur noir
WCAG 12.68:1 · APCA Lc 74
Meilleure couleur de texte: #000000
WCAG 12.68:1 (AAA) · APCA Lc 74
Contrast pairs
Extraits de code
CSS
:root {
--tender-turquoise: #82d9c5;
--tender-turquoise-rgb: 130 217 197;
--tender-turquoise-oklch: oklch(0.825 0.09 177.6);
}
.element {
color: var(--tender-turquoise);
background-color: hsl(166 53% 68%);
border-color: oklch(0.825 0.09 177.6);
}Tailwind CSS v4
@theme {
--color-tender-turquoise: #82d9c5;
--color-tender-turquoise-50: #dbfef6;
--color-tender-turquoise-100: #c9f2e9;
--color-tender-turquoise-200: #abe1d5;
--color-tender-turquoise-300: #83c7b9;
--color-tender-turquoise-400: #5eb09e;
--color-tender-turquoise-500: #329986;
--color-tender-turquoise-600: #2d8271;
--color-tender-turquoise-700: #24685a;
--color-tender-turquoise-800: #194c41;
--color-tender-turquoise-900: #10352d;
--color-tender-turquoise-950: #03201a;
}SCSS
$tender-turquoise: #82d9c5;
$tender-turquoise-rgb: 130, 217, 197;
$tender-turquoise-light: mix(#fff, $tender-turquoise, 20%);
$tender-turquoise-dark: mix(#000, $tender-turquoise, 20%);
.element {
color: $tender-turquoise;
box-shadow: 0 0 0 2px rgba($tender-turquoise, 0.35);
}