Dichtstbijzijnde benoemde kleur · #77BCC3
#77BCC3
Dichtstbijzijnde benoemde kleur: Cuttlefish
#77BCC3 (rgb(119 188 195), hsl(186 39% 62%), oklch(0.752 0.07 204)) komt het dichtst bij de benoemde kleur Cuttlefish. Bekijk tinten, schaduwen, harmonieën, WCAG- en APCA-contrast en CSS-, Tailwind v4- en SCSS-code.
#77BCC3
oklch(0.752 0.07 204)
Kleurconversies
- 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%)
Tinten · Schaduwen · Tonen
Tinten
- 85C3C9
- 94C9CF
- A1D0D5
- AFD7DB
- BCDDE1
- CAE4E7
- D7EBED
- E4F2F3
- F2F8F9
Schaduwen
- 67A3A9
- 578B90
- 477378
- 385D60
- 2A474A
- 1C3234
- 101F20
- 050D0E
- 010202
Tonen
- 79B6BC
- 7BB0B5
- 7CAAAE
- 7DA4A8
- 7E9EA1
- 7F989A
- 809294
- 808C8D
- 808687
Kleurharmonieën
Complementair +180°
- 77BCC3
Cuttlefish
- D89E99
≈ Rhapsodic
Analoog -30° +30°
- 77BCC3
Cuttlefish
- 7FBEAB
≈ Peppermint Bar
- 82B7D5
≈ Regale Blue
Triadisch +120° +240°
- 77BCC3
Cuttlefish
- C5A0C8
≈ Stormy Sunrise
- C4AB7B
≈ Cobbler
Gesplitst complementair +150° +210°
- 77BCC3
Cuttlefish
- D39DB2
≈ Quilted Heart
- D3A385
≈ Yolande
Tetradisch +90° +180° +270°
- 77BCC3
Cuttlefish
- B0A6D7
≈ Ariel’s Delight
- D89E99
≈ Rhapsodic
- AEB480
≈ Great Green
Contrast en toegankelijkheid
Ag
FailOp wit
WCAG 2.15:1 · APCA Lc 42
Ag
AAAOp zwart
WCAG 9.76:1 · APCA Lc 60
Beste tekstkleur: #000000
WCAG 9.76:1 (AAA) · APCA Lc 60
Contrast pairs
Codefragmenten
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);
}