이름 색상 · #BCCBC4
Soothing Spring
Soothing Spring은(는) #BCCBC4: rgb(188 203 196), hsl(152 13% 77%), oklch(0.829 0.019 166.3). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
What does Gray mean? → · Soothing Spring color name →
#BCCBC4
oklch(0.829 0.019 166.3)
색상 변환
- HEX
- #bccbc4
- RGB
- rgb(188 203 196)
- HSL
- hsl(152 13% 77%)
- HWB
- hwb(152 74% 20%)
- OKLCH
- oklch(0.829 0.019 166.3)
- OKLab
- oklab(0.829 -0.018 0.005)
- CIE Lab
- lab(80.37 -6.28 1.66)
- LCH
- lch(80.37 6.5 165.2)
- CMYK
- cmyk(7% 0% 3% 20%)
틴트 · 셰이드 · 톤
틴트
- C3D0CA
- C9D5D0
- D0DAD5
- D6E0DB
- DDE5E1
- E4EAE7
- EBEFED
- F1F4F3
- F8FAF9
셰이드
- A3B0AA
- 8B9691
- 737D78
- 5D6561
- 474D4A
- 323735
- 1F2221
- 0D0F0E
- 020202
톤
- B6C3BD
- B0BCB6
- AAB4AF
- A4ACA8
- 9EA5A1
- 989D9B
- 929694
- 8C8E8D
- 868787
색 조화
보색 +180°
- BCCBC4
Soothing Spring
- D1C2C9
≈ Bassinet
유사색 -30° +30°
- BCCBC4
Soothing Spring
- C1CABE
≈ Willow Green
- B9CBCB
≈ Blue Shale
삼각 배색 +120° +240°
- BCCBC4
Soothing Spring
- C5C5D3
≈ Kiri Mist
- D2C3BD
≈ Josephine
분열 보색 +150° +210°
- BCCBC4
Soothing Spring
- CCC3CF
≈ Orchid Hush
- D3C2C2
≈ Wishy-Washy Brown
사각 배색 +90° +180° +270°
- BCCBC4
Soothing Spring
- BFC8D3
≈ Northern Exposure
- D1C2C9
≈ Bassinet
- CEC5BA
≈ Zebra Finch
대비 및 접근성
Ag
Fail흰색 위
WCAG 1.68:1 · APCA Lc 30
Ag
AAA검은색 위
WCAG 12.47:1 · APCA Lc 73
가장 좋은 글자색: #000000
WCAG 12.47:1 (AAA) · APCA Lc 73
Contrast pairs
코드 스니펫
CSS
:root {
--soothing-spring: #bccbc4;
--soothing-spring-rgb: 188 203 196;
--soothing-spring-oklch: oklch(0.829 0.019 166.3);
}
.element {
color: var(--soothing-spring);
background-color: hsl(152 13% 77%);
border-color: oklch(0.829 0.019 166.3);
}Tailwind CSS v4
@theme {
--color-soothing-spring: #bccbc4;
--color-soothing-spring-50: #f0f7f4;
--color-soothing-spring-100: #e2eae7;
--color-soothing-spring-200: #cdd7d3;
--color-soothing-spring-300: #afbbb5;
--color-soothing-spring-400: #94a29c;
--color-soothing-spring-500: #7b8a83;
--color-soothing-spring-600: #68756f;
--color-soothing-spring-700: #535e59;
--color-soothing-spring-800: #3d4541;
--color-soothing-spring-900: #2a2f2c;
--color-soothing-spring-950: #171c1a;
}SCSS
$soothing-spring: #bccbc4;
$soothing-spring-rgb: 188, 203, 196;
$soothing-spring-light: mix(#fff, $soothing-spring, 20%);
$soothing-spring-dark: mix(#000, $soothing-spring, 20%);
.element {
color: $soothing-spring;
box-shadow: 0 0 0 2px rgba($soothing-spring, 0.35);
}