이름 색상 · #B2C4BB
Hearth Frost
Hearth Frost은(는) #B2C4BB: rgb(178 196 187), hsl(150 13% 73%), oklch(0.804 0.023 164.4). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
What does Gray mean? → · Hearth Frost color name →
#B2C4BB
oklch(0.804 0.023 164.4)
색상 변환
- HEX
- #b2c4bb
- RGB
- rgb(178 196 187)
- HSL
- hsl(150 13% 73%)
- HWB
- hwb(150 70% 23%)
- OKLCH
- oklch(0.804 0.023 164.4)
- OKLab
- oklab(0.804 -0.022 0.006)
- CIE Lab
- lab(77.57 -7.67 2.32)
- LCH
- lch(77.57 8.01 163.1)
- CMYK
- cmyk(9% 0% 5% 23%)
틴트 · 셰이드 · 톤
틴트
- BACAC2
- C1D0C8
- C9D5CF
- D0DBD6
- D8E1DD
- E0E7E3
- E7EDEA
- EFF3F1
- F7F9F8
셰이드
- 9AAAA2
- 83918A
- 6D7873
- 57615C
- 434A46
- 2F3532
- 1D211F
- 0C0E0D
- 010202
톤
- ADBDB5
- A8B6AF
- A3AFA9
- 9EA8A3
- 99A19D
- 949B97
- 8F9491
- 8A8D8B
- 858786
색 조화
보색 +180°
- B2C4BB
Hearth Frost
- CBB9C3
≈ Queen’s Violet
유사색 -30° +30°
- B2C4BB
Hearth Frost
- B9C3B4
≈ Belize Green
- AFC4C3
≈ Jungle Mist
삼각 배색 +120° +240°
- B2C4BB
Hearth Frost
- BDBDCE
≈ A Stitch in Time
- CDBBB3
≈ Mothy
분열 보색 +150° +210°
- B2C4BB
Hearth Frost
- C5BBCA
≈ Gentleman’s Suit
- CEB9BA
≈ Mediterranean Sunset
사각 배색 +90° +180° +270°
- B2C4BB
Hearth Frost
- B5C0CE
≈ Mistral
- CBB9C3
≈ Queen’s Violet
- C8BDAF
≈ Creamy Mushroom
대비 및 접근성
Ag
Fail흰색 위
WCAG 1.82:1 · APCA Lc 34
Ag
AAA검은색 위
WCAG 11.50:1 · APCA Lc 68
가장 좋은 글자색: #000000
WCAG 11.50:1 (AAA) · APCA Lc 68
Contrast pairs
코드 스니펫
CSS
:root {
--hearth-frost: #b2c4bb;
--hearth-frost-rgb: 178 196 187;
--hearth-frost-oklch: oklch(0.804 0.023 164.4);
}
.element {
color: var(--hearth-frost);
background-color: hsl(150 13% 73%);
border-color: oklch(0.804 0.023 164.4);
}Tailwind CSS v4
@theme {
--color-hearth-frost: #b2c4bb;
--color-hearth-frost-50: #eff7f4;
--color-hearth-frost-100: #e1eae6;
--color-hearth-frost-200: #cbd8d2;
--color-hearth-frost-300: #adbbb5;
--color-hearth-frost-400: #92a39b;
--color-hearth-frost-500: #798b82;
--color-hearth-frost-600: #66766e;
--color-hearth-frost-700: #525e58;
--color-hearth-frost-800: #3b4540;
--color-hearth-frost-900: #29302c;
--color-hearth-frost-950: #171c19;
}SCSS
$hearth-frost: #b2c4bb;
$hearth-frost-rgb: 178, 196, 187;
$hearth-frost-light: mix(#fff, $hearth-frost, 20%);
$hearth-frost-dark: mix(#000, $hearth-frost, 20%);
.element {
color: $hearth-frost;
box-shadow: 0 0 0 2px rgba($hearth-frost, 0.35);
}