Couleur nommée la plus proche · #77BCC3
#77BCC3
Couleur nommée la plus proche: Cuttlefish
#77BCC3 (rgb(119 188 195), hsl(186 39% 62%), oklch(0.752 0.07 204)) est la plus proche de la couleur nommée Cuttlefish. Teintes, ombres, harmonies, contraste WCAG et APCA, et code CSS, Tailwind v4 et SCSS.
#77BCC3
oklch(0.752 0.07 204)
Conversions de couleur
- HEX
- #77bcc3
- RGB
- rgb(119 188 195)
- HSL
- hsl(186 39% 62%)
- HWB
- hwb(186 47% 24%)
- OKLCH
- oklch(0.752 0.07 204)
- OKLab
- oklab(0.752 -0.064 -0.029)
- CIE Lab
- lab(71.87 -21.33 -10.82)
- LCH
- lch(71.87 23.92 206.9)
- CMYK
- cmyk(39% 4% 0% 24%)
Teintes · Ombres · Tons
Teintes
- 85C3C9
- 94C9CF
- A1D0D5
- AFD7DB
- BCDDE1
- CAE4E7
- D7EBED
- E4F2F3
- F2F8F9
Ombres
- 67A3A9
- 578B90
- 477378
- 385D60
- 2A474A
- 1C3234
- 101F20
- 050D0E
- 010202
Tons
- 79B6BC
- 7BB0B5
- 7CAAAE
- 7DA4A8
- 7E9EA1
- 7F989A
- 809294
- 808C8D
- 808687
Harmonies de couleurs
Complémentaire +180°
- 77BCC3
Cuttlefish
- D89E99
≈ Rhapsodic
Analogue -30° +30°
- 77BCC3
Cuttlefish
- 7FBEAB
≈ Peppermint Bar
- 82B7D5
≈ Regale Blue
Triadique +120° +240°
- 77BCC3
Cuttlefish
- C5A0C8
≈ Stormy Sunrise
- C4AB7B
≈ Cobbler
Complémentaire divisée +150° +210°
- 77BCC3
Cuttlefish
- D39DB2
≈ Quilted Heart
- D3A385
≈ Yolande
Tétradique +90° +180° +270°
- 77BCC3
Cuttlefish
- B0A6D7
≈ Ariel’s Delight
- D89E99
≈ Rhapsodic
- AEB480
≈ Great Green
Contraste et accessibilité
Ag
FailSur blanc
WCAG 2.15:1 · APCA Lc 42
Ag
AAASur noir
WCAG 9.76:1 · APCA Lc 60
Meilleure couleur de texte: #000000
WCAG 9.76:1 (AAA) · APCA Lc 60
Contrast pairs
Extraits de code
CSS
:root {
--cuttlefish: #77bcc3;
--cuttlefish-rgb: 119 188 195;
--cuttlefish-oklch: oklch(0.752 0.07 204);
}
.element {
color: var(--cuttlefish);
background-color: hsl(186 39% 62%);
border-color: oklch(0.752 0.07 204);
}Tailwind CSS v4
@theme {
--color-cuttlefish: #77bcc3;
--color-cuttlefish-50: #dffbff;
--color-cuttlefish-100: #ceeff3;
--color-cuttlefish-200: #b2dde3;
--color-cuttlefish-300: #8dc2c9;
--color-cuttlefish-400: #6aabb1;
--color-cuttlefish-500: #46949c;
--color-cuttlefish-600: #3c7d83;
--color-cuttlefish-700: #306469;
--color-cuttlefish-800: #214a4d;
--color-cuttlefish-900: #163335;
--color-cuttlefish-950: #071f20;
}SCSS
$cuttlefish: #77bcc3;
$cuttlefish-rgb: 119, 188, 195;
$cuttlefish-light: mix(#fff, $cuttlefish, 20%);
$cuttlefish-dark: mix(#000, $cuttlefish, 20%);
.element {
color: $cuttlefish;
box-shadow: 0 0 0 2px rgba($cuttlefish, 0.35);
}