لون مسمّى · #B1D2DF
Early June
Early June هو #B1D2DF: rgb(177 210 223)، hsl(197 42% 78%)، oklch(0.844 0.04 223.6). شاهد الدرجات الفاتحة والداكنة والتناسقات وتباين WCAG وAPCA وأكواد CSS وTailwind v4 وSCSS.
What does Cyan mean? → · Early June color name →
#B1D2DF
oklch(0.844 0.04 223.6)
تحويلات الألوان
- HEX
- #b1d2df
- RGB
- rgb(177 210 223)
- HSL
- hsl(197 42% 78%)
- HWB
- hwb(197 69% 13%)
- OKLCH
- oklch(0.844 0.04 223.6)
- OKLab
- oklab(0.844 -0.029 -0.027)
- CIE Lab
- lab(82.09 -9.26 -10.3)
- LCH
- lch(82.09 13.85 228)
- CMYK
- cmyk(21% 6% 0% 13%)
درجات فاتحة · درجات داكنة · درجات رمادية
درجات فاتحة
- B9D6E2
- C1DBE5
- C8DFE9
- D0E4EC
- D8E8EF
- E0EDF2
- E8F1F5
- EFF6F9
- F7FAFC
درجات داكنة
- 99B6C2
- 839BA5
- 6C818A
- 57686F
- 425056
- 2F393D
- 1C2427
- 0C1012
- 010202
درجات رمادية
- ACCAD5
- A7C1CB
- A2B9C2
- 9DB0B8
- 99A8AE
- 94A0A5
- 8F989C
- 8A9092
- 858889
تناسق الألوان
متمم +180°
- B1D2DF
Early June
- E3C4B7
≈ Antoinette Pink
متجاور -30° +30°
- B1D2DF
Early June
- AFD4D3
≈ Lake Breeze
- BACEE6
≈ Maritime
ثلاثي +120° +240°
- B1D2DF
Early June
- DFC2D2
≈ Elusive Mauve
- D0CDB0
≈ Platinum Sage
متمم منقسم +150° +210°
- B1D2DF
Early June
- E4C2C4
≈ Odyssey Plum
- DCC8B0
≈ Lentil
رباعي +90° +180° +270°
- B1D2DF
Early June
- D5C5DE
≈ On Location
- E3C4B7
≈ Antoinette Pink
- C2D2B8
≈ Bonsai Tint
التباين وإمكانية الوصول
Ag
Failعلى الأبيض
WCAG 1.59:1 · APCA Lc 27
Ag
AAAعلى الأسود
WCAG 13.15:1 · APCA Lc 76
أفضل لون للنص: #000000
WCAG 13.15:1 (AAA) · APCA Lc 76
Contrast pairs
مقتطفات الأكواد
CSS
:root {
--early-june: #b1d2df;
--early-june-rgb: 177 210 223;
--early-june-oklch: oklch(0.844 0.04 223.6);
}
.element {
color: var(--early-june);
background-color: hsl(197 42% 78%);
border-color: oklch(0.844 0.04 223.6);
}Tailwind CSS v4
@theme {
--color-early-june: #b1d2df;
--color-early-june-50: #eaf8fe;
--color-early-june-100: #dbebf2;
--color-early-june-200: #c3d8e1;
--color-early-june-300: #a3bcc7;
--color-early-june-400: #86a4b0;
--color-early-june-500: #6a8c9a;
--color-early-june-600: #5a7782;
--color-early-june-700: #485f68;
--color-early-june-800: #33464c;
--color-early-june-900: #233035;
--color-early-june-950: #121c20;
}SCSS
$early-june: #b1d2df;
$early-june-rgb: 177, 210, 223;
$early-june-light: mix(#fff, $early-june, 20%);
$early-june-dark: mix(#000, $early-june, 20%);
.element {
color: $early-june;
box-shadow: 0 0 0 2px rgba($early-june, 0.35);
}