Najbliższy nazwany kolor · #7EB9C0
#7EB9C0
Najbliższy nazwany kolor: Cuttlefish
#7EB9C0 (rgb(126 185 192), hsl(186 34% 62%), oklch(0.748 0.062 205.3)) jest najbliższy nazwanemu kolorowi Cuttlefish. Zobacz odcienie, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
#7EB9C0
oklch(0.748 0.062 205.3)
Konwersje koloru
- HEX
- #7eb9c0
- RGB
- rgb(126 185 192)
- HSL
- hsl(186 34% 62%)
- HWB
- hwb(186 49% 25%)
- OKLCH
- oklch(0.748 0.062 205.3)
- OKLab
- oklab(0.748 -0.056 -0.026)
- CIE Lab
- lab(71.29 -18.51 -9.99)
- LCH
- lch(71.29 21.03 208.4)
- CMYK
- cmyk(34% 4% 0% 25%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 8BC0C6
- 98C7CC
- A5CED3
- B2D5D9
- BFDCDF
- CCE3E6
- D9EAEC
- E5F1F2
- F2F8F9
Odcienie ciemniejsze
- 6DA0A7
- 5C898E
- 4C7176
- 3C5B5F
- 2D4649
- 1F3134
- 111E20
- 050D0E
- 010202
Tony
- 7FB3B9
- 80ADB3
- 80A8AC
- 81A2A6
- 819CA0
- 819799
- 819193
- 818B8C
- 808686
Harmonie kolorów
Komplementarna +180°
- 7EB9C0
Cuttlefish
- D29F99
≈ Evening Dress
Analogowa -30° +30°
- 7EB9C0
Cuttlefish
- 84BBAB
≈ Patina Hue
- 87B4CF
≈ Batch Blue
Triada +120° +240°
- 7EB9C0
Cuttlefish
- C2A0C3
≈ Pale Grape
- BFAB81
≈ Faded Letter
Komplementarna rozszczepiona +150° +210°
- 7EB9C0
Cuttlefish
- CE9EAF
≈ Quilted Heart
- CDA488
≈ Sienna Buff
Tetrada +90° +180° +270°
- 7EB9C0
Cuttlefish
- B0A6D1
≈ Ariel’s Delight
- D29F99
≈ Evening Dress
- ABB286
≈ Great Green
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.19:1 · APCA Lc 43
Ag
AAANa czerni
WCAG 9.58:1 · APCA Lc 59
Najlepszy kolor tekstu: #000000
WCAG 9.58:1 (AAA) · APCA Lc 59
Contrast pairs
Fragmenty kodu
CSS
:root {
--cuttlefish: #7eb9c0;
--cuttlefish-rgb: 126 185 192;
--cuttlefish-oklch: oklch(0.748 0.062 205.3);
}
.element {
color: var(--cuttlefish);
background-color: hsl(186 34% 62%);
border-color: oklch(0.748 0.062 205.3);
}Tailwind CSS v4
@theme {
--color-cuttlefish: #7eb9c0;
--color-cuttlefish-50: #e2fbfe;
--color-cuttlefish-100: #d1eef2;
--color-cuttlefish-200: #b7dce2;
--color-cuttlefish-300: #93c1c8;
--color-cuttlefish-400: #72a9b0;
--color-cuttlefish-500: #51929a;
--color-cuttlefish-600: #457c82;
--color-cuttlefish-700: #376368;
--color-cuttlefish-800: #27494c;
--color-cuttlefish-900: #1a3235;
--color-cuttlefish-950: #0a1e20;
}SCSS
$cuttlefish: #7eb9c0;
$cuttlefish-rgb: 126, 185, 192;
$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);
}