Couleur nommée · #2DA4B6
Sparkling Cove
Sparkling Cove correspond à #2DA4B6 : rgb(45 164 182), hsl(188 60% 45%), oklch(0.663 0.104 210). Teintes, ombres, harmonies, contraste WCAG et APCA, et code CSS, Tailwind v4 et SCSS.
What does Cyan mean? → · Sparkling Cove color name →
#2DA4B6
oklch(0.663 0.104 210)
Conversions de couleur
- HEX
- #2da4b6
- RGB
- rgb(45 164 182)
- HSL
- hsl(188 60% 45%)
- HWB
- hwb(188 18% 29%)
- OKLCH
- oklch(0.663 0.104 210)
- OKLab
- oklab(0.663 -0.09 -0.052)
- CIE Lab
- lab(61.68 -28.69 -19.21)
- LCH
- lch(61.68 34.53 213.8)
- CMYK
- cmyk(75% 10% 0% 29%)
Teintes · Ombres · Tons
Teintes
- 4CADBD
- 64B6C5
- 79BFCC
- 8EC8D3
- A1D2DA
- B4DBE2
- C7E4E9
- DAEDF0
- ECF6F8
Ombres
- 268E9E
- 1F7986
- 18646F
- 115059
- 0B3D44
- 062B30
- 021A1D
- 010A0C
- 000102
Tons
- 3EA1B1
- 4A9DAB
- 549AA6
- 5D96A0
- 64939B
- 6B8F96
- 718B90
- 76888B
- 7B8485
Harmonies de couleurs
Complémentaire +180°
- 2DA4B6
Sparkling Cove
- CB7A6D
≈ Canyon Clay
Analogue -30° +30°
- 2DA4B6
Sparkling Cove
- 37A895
≈ Jewel Weed
- 529BCC
≈ Blue Iguana
Triadique +120° +240°
- 2DA4B6
Sparkling Cove
- B77BB1
≈ Colombo Red Mauve
- AC9041
≈ Turmeric
Complémentaire divisée +150° +210°
- 2DA4B6
Sparkling Cove
- C77790
≈ Watermelon Pink
- C2834E
≈ Rookwood Amber
Tétradique +90° +180° +270°
- 2DA4B6
Sparkling Cove
- 9D84C9
≈ Lilac Purple
- CB7A6D
≈ Canyon Clay
- 8B9C50
≈ Spinach Green
Contraste et accessibilité
Ag
FailSur blanc
WCAG 2.95:1 · APCA Lc 56
Ag
AAASur noir
WCAG 7.09:1 · APCA Lc 46
Meilleure couleur de texte: #000000
WCAG 7.09:1 (AAA) · APCA Lc 46
Contrast pairs
Extraits de code
CSS
:root {
--sparkling-cove: #2da4b6;
--sparkling-cove-rgb: 45 164 182;
--sparkling-cove-oklch: oklch(0.663 0.104 210);
}
.element {
color: var(--sparkling-cove);
background-color: hsl(188 60% 45%);
border-color: oklch(0.663 0.104 210);
}Tailwind CSS v4
@theme {
--color-sparkling-cove: #2da4b6;
--color-sparkling-cove-50: #d4feff;
--color-sparkling-cove-100: #c1f2fc;
--color-sparkling-cove-200: #a0e1ee;
--color-sparkling-cove-300: #74c6d6;
--color-sparkling-cove-400: #45afc0;
--color-sparkling-cove-500: #0098ac;
--color-sparkling-cove-600: #008191;
--color-sparkling-cove-700: #006774;
--color-sparkling-cove-800: #004c55;
--color-sparkling-cove-900: #00353b;
--color-sparkling-cove-950: #002025;
}SCSS
$sparkling-cove: #2da4b6;
$sparkling-cove-rgb: 45, 164, 182;
$sparkling-cove-light: mix(#fff, $sparkling-cove, 20%);
$sparkling-cove-dark: mix(#000, $sparkling-cove, 20%);
.element {
color: $sparkling-cove;
box-shadow: 0 0 0 2px rgba($sparkling-cove, 0.35);
}