이름 색상 · #9FBDAD
White Spruce
White Spruce은(는) #9FBDAD: rgb(159 189 173), hsl(148 19% 68%), oklch(0.771 0.04 162.1). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
What does Green mean? → · White Spruce color name →
#9FBDAD
oklch(0.771 0.04 162.1)
색상 변환
- HEX
- #9fbdad
- RGB
- rgb(159 189 173)
- HSL
- hsl(148 19% 68%)
- HWB
- hwb(148 62% 26%)
- OKLCH
- oklch(0.771 0.04 162.1)
- OKLab
- oklab(0.771 -0.038 0.012)
- CIE Lab
- lab(74.02 -12.95 4.55)
- LCH
- lch(74.02 13.72 160.6)
- CMYK
- cmyk(16% 0% 8% 26%)
틴트 · 셰이드 · 톤
틴트
- A8C3B5
- B2CABD
- BBD1C5
- C5D7CD
- CEDED5
- D8E4DE
- E2EBE6
- EBF2EE
- F5F8F7
셰이드
- 8AA496
- 758C7F
- 61746A
- 4D5D55
- 3B4741
- 29332D
- 181F1B
- 090D0B
- 010201
톤
- 9CB7A8
- 99B1A4
- 96AA9F
- 93A49B
- 909E96
- 8D9892
- 89928D
- 868C89
- 838684
색 조화
보색 +180°
- 9FBDAD
White Spruce
- C7ABBC
≈ Desireé
유사색 -30° +30°
- 9FBDAD
White Spruce
- ABBAA1
≈ Winter Squash
- 98BDBB
≈ Lap Pool Blue
삼각 배색 +120° +240°
- 9FBDAD
White Spruce
- B0B2CE
≈ Purple Freedom
- CCADA1
≈ Art Deco Pink
분열 보색 +150° +210°
- 9FBDAD
White Spruce
- BDAEC7
≈ Fancy Pansy
- CDABAE
≈ Vista
사각 배색 +90° +180° +270°
- 9FBDAD
White Spruce
- A3B7CE
≈ Misted Eve
- C7ABBC
≈ Desireé
- C5B19A
≈ Sandrock
대비 및 접근성
Ag
Fail흰색 위
WCAG 2.02:1 · APCA Lc 39
Ag
AAA검은색 위
WCAG 10.35:1 · APCA Lc 63
가장 좋은 글자색: #000000
WCAG 10.35:1 (AAA) · APCA Lc 63
Contrast pairs
코드 스니펫
CSS
:root {
--white-spruce: #9fbdad;
--white-spruce-rgb: 159 189 173;
--white-spruce-oklch: oklch(0.771 0.04 162.1);
}
.element {
color: var(--white-spruce);
background-color: hsl(148 19% 68%);
border-color: oklch(0.771 0.04 162.1);
}Tailwind CSS v4
@theme {
--color-white-spruce: #9fbdad;
--color-white-spruce-50: #ebf9f2;
--color-white-spruce-100: #ddece4;
--color-white-spruce-200: #c6dad0;
--color-white-spruce-300: #a6beb2;
--color-white-spruce-400: #8aa697;
--color-white-spruce-500: #6f8f7e;
--color-white-spruce-600: #5e796b;
--color-white-spruce-700: #4b6155;
--color-white-spruce-800: #37473e;
--color-white-spruce-900: #25312a;
--color-white-spruce-950: #141d18;
}SCSS
$white-spruce: #9fbdad;
$white-spruce-rgb: 159, 189, 173;
$white-spruce-light: mix(#fff, $white-spruce, 20%);
$white-spruce-dark: mix(#000, $white-spruce, 20%);
.element {
color: $white-spruce;
box-shadow: 0 0 0 2px rgba($white-spruce, 0.35);
}