Najbliższy nazwany kolor · #7AB1C7
#7AB1C7
Najbliższy nazwany kolor: Crystal Lake
#7AB1C7 (rgb(122 177 199), hsl(197 41% 63%), oklch(0.73 0.066 224.9)) jest najbliższy nazwanemu kolorowi Crystal Lake. Zobacz odcienie, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
#7AB1C7
oklch(0.73 0.066 224.9)
Konwersje koloru
- HEX
- #7ab1c7
- RGB
- rgb(122 177 199)
- HSL
- hsl(197 41% 63%)
- HWB
- hwb(197 48% 22%)
- OKLCH
- oklch(0.73 0.066 224.9)
- OKLab
- oklab(0.73 -0.046 -0.046)
- CIE Lab
- lab(68.98 -14.46 -17.29)
- LCH
- lch(68.98 22.54 230.1)
- CMYK
- cmyk(39% 11% 0% 22%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- 88B9CD
- 95C0D2
- A2C8D8
- B0D0DD
- BDD8E3
- CAE0E9
- D7E7EE
- E4EFF4
- F2F7F9
Odcienie ciemniejsze
- 6999AD
- 598393
- 496C7A
- 3A5762
- 2B424C
- 1D2F36
- 101C21
- 050C0E
- 010102
Tony
- 7BACC0
- 7CA7B9
- 7DA2B1
- 7E9DAA
- 7F98A3
- 7F949C
- 808F95
- 808A8E
- 808587
Harmonie kolorów
Komplementarna +180°
- 7AB1C7
Crystal Lake
- CC9B86
≈ Artefact
Analogowa -30° +30°
- 7AB1C7
Crystal Lake
- 75B5B4
≈ Kingfisher Turquoise
- 8CAAD1
≈ Placid Blue
Triada +120° +240°
- 7AB1C7
Crystal Lake
- C798B1
≈ Lady’s Cushions Pink
- ADAB7A
≈ Stuffed Olive
Komplementarna rozszczepiona +150° +210°
- 7AB1C7
Crystal Lake
- CE979A
≈ Silk Stone
- C0A279
≈ Season Finale
Tetrada +90° +180° +270°
- 7AB1C7
Crystal Lake
- B89CC5
≈ Crocus Petal
- CC9B86
≈ Artefact
- 96B188
≈ Foliage
Kontrast i dostępność
Ag
FailNa bieli
WCAG 2.34:1 · APCA Lc 46
Ag
AAANa czerni
WCAG 8.94:1 · APCA Lc 56
Najlepszy kolor tekstu: #000000
WCAG 8.94:1 (AAA) · APCA Lc 56
Contrast pairs
Fragmenty kodu
CSS
:root {
--crystal-lake: #7ab1c7;
--crystal-lake-rgb: 122 177 199;
--crystal-lake-oklch: oklch(0.73 0.066 224.9);
}
.element {
color: var(--crystal-lake);
background-color: hsl(197 41% 63%);
border-color: oklch(0.73 0.066 224.9);
}Tailwind CSS v4
@theme {
--color-crystal-lake: #7ab1c7;
--color-crystal-lake-50: #e3faff;
--color-crystal-lake-100: #d2edf9;
--color-crystal-lake-200: #b8dbea;
--color-crystal-lake-300: #94bfd2;
--color-crystal-lake-400: #74a7bc;
--color-crystal-lake-500: #5390a7;
--color-crystal-lake-600: #47798d;
--color-crystal-lake-700: #386171;
--color-crystal-lake-800: #274853;
--color-crystal-lake-900: #1a323a;
--color-crystal-lake-950: #0a1d24;
}SCSS
$crystal-lake: #7ab1c7;
$crystal-lake-rgb: 122, 177, 199;
$crystal-lake-light: mix(#fff, $crystal-lake, 20%);
$crystal-lake-dark: mix(#000, $crystal-lake, 20%);
.element {
color: $crystal-lake;
box-shadow: 0 0 0 2px rgba($crystal-lake, 0.35);
}