이름 색상 · #BFD0CB
White Box
White Box은(는) #BFD0CB: rgb(191 208 203), hsl(162 15% 78%), oklch(0.843 0.02 176.3). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
What does Gray mean? → · White Box color name →
#BFD0CB
oklch(0.843 0.02 176.3)
색상 변환
- HEX
- #bfd0cb
- RGB
- rgb(191 208 203)
- HSL
- hsl(162 15% 78%)
- HWB
- hwb(162 75% 18%)
- OKLCH
- oklch(0.843 0.02 176.3)
- OKLab
- oklab(0.843 -0.02 0.001)
- CIE Lab
- lab(82.07 -6.67 0.41)
- LCH
- lch(82.07 6.68 176.4)
- CMYK
- cmyk(8% 0% 2% 18%)
틴트 · 셰이드 · 톤
틴트
- C5D5D0
- CCD9D5
- D2DEDA
- D8E3E0
- DFE7E5
- E5ECEA
- ECF1EF
- F2F5F4
- F8FAFA
셰이드
- A6B5B0
- 8D9A96
- 75807D
- 5E6765
- 484F4D
- 333937
- 1F2322
- 0D100F
- 020202
톤
- B9C8C3
- B2BFBC
- ACB7B4
- A5AFAC
- 9FA7A5
- 999F9D
- 929796
- 8C8F8E
- 868887
색 조화
보색 +180°
- BFD0CB
White Box
- D7C7CC
≈ Odyssey Lilac
유사색 -30° +30°
- BFD0CB
White Box
- C4CFC4
≈ Silver Grass
- BED0D2
≈ Detroit
삼각 배색 +120° +240°
- BFD0CB
White Box
- CCC9D7
≈ Magic Scent
- D6C9C0
≈ Unfussy Beige
분열 보색 +150° +210°
- BFD0CB
White Box
- D3C7D2
≈ Enchant
- D8C7C5
≈ Fairview Taupe
사각 배색 +90° +180° +270°
대비 및 접근성
Ag
Fail흰색 위
WCAG 1.60:1 · APCA Lc 27
Ag
AAA검은색 위
WCAG 13.09:1 · APCA Lc 76
가장 좋은 글자색: #000000
WCAG 13.09:1 (AAA) · APCA Lc 76
Contrast pairs
코드 스니펫
CSS
:root {
--white-box: #bfd0cb;
--white-box-rgb: 191 208 203;
--white-box-oklch: oklch(0.843 0.02 176.3);
}
.element {
color: var(--white-box);
background-color: hsl(162 15% 78%);
border-color: oklch(0.843 0.02 176.3);
}Tailwind CSS v4
@theme {
--color-white-box: #bfd0cb;
--color-white-box-50: #f0f7f5;
--color-white-box-100: #e1eae8;
--color-white-box-200: #ccd7d4;
--color-white-box-300: #adbbb7;
--color-white-box-400: #93a29e;
--color-white-box-500: #798b86;
--color-white-box-600: #677571;
--color-white-box-700: #525e5a;
--color-white-box-800: #3c4542;
--color-white-box-900: #292f2d;
--color-white-box-950: #171c1a;
}SCSS
$white-box: #bfd0cb;
$white-box-rgb: 191, 208, 203;
$white-box-light: mix(#fff, $white-box, 20%);
$white-box-dark: mix(#000, $white-box, 20%);
.element {
color: $white-box;
box-shadow: 0 0 0 2px rgba($white-box, 0.35);
}