이름 색상 · #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);
}