أقرب لون مسمّى · #7AB1C7
#7AB1C7
أقرب لون مسمّى: Crystal Lake
#7AB1C7 (rgb(122 177 199)، hsl(197 41% 63%)، oklch(0.73 0.066 224.9)) أقرب إلى اللون المسمّى Crystal Lake. شاهد الدرجات الفاتحة والداكنة والتناسقات وتباين WCAG وAPCA وأكواد CSS وTailwind v4 وSCSS.
#7AB1C7
oklch(0.73 0.066 224.9)
تحويلات الألوان
- 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%)
درجات فاتحة · درجات داكنة · درجات رمادية
درجات فاتحة
- 88B9CD
- 95C0D2
- A2C8D8
- B0D0DD
- BDD8E3
- CAE0E9
- D7E7EE
- E4EFF4
- F2F7F9
درجات داكنة
- 6999AD
- 598393
- 496C7A
- 3A5762
- 2B424C
- 1D2F36
- 101C21
- 050C0E
- 010102
درجات رمادية
- 7BACC0
- 7CA7B9
- 7DA2B1
- 7E9DAA
- 7F98A3
- 7F949C
- 808F95
- 808A8E
- 808587
تناسق الألوان
متمم +180°
- 7AB1C7
Crystal Lake
- CC9B86
≈ Artefact
متجاور -30° +30°
- 7AB1C7
Crystal Lake
- 75B5B4
≈ Kingfisher Turquoise
- 8CAAD1
≈ Placid Blue
ثلاثي +120° +240°
- 7AB1C7
Crystal Lake
- C798B1
≈ Lady’s Cushions Pink
- ADAB7A
≈ Stuffed Olive
متمم منقسم +150° +210°
- 7AB1C7
Crystal Lake
- CE979A
≈ Silk Stone
- C0A279
≈ Season Finale
رباعي +90° +180° +270°
- 7AB1C7
Crystal Lake
- B89CC5
≈ Crocus Petal
- CC9B86
≈ Artefact
- 96B188
≈ Foliage
التباين وإمكانية الوصول
Ag
Failعلى الأبيض
WCAG 2.34:1 · APCA Lc 46
Ag
AAAعلى الأسود
WCAG 8.94:1 · APCA Lc 56
أفضل لون للنص: #000000
WCAG 8.94:1 (AAA) · APCA Lc 56
Contrast pairs
مقتطفات الأكواد
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);
}