이름 색상 · #ABDCEE
Spring Shower
Spring Shower은(는) #ABDCEE: rgb(171 220 238), hsl(196 66% 80%), oklch(0.866 0.056 222.4). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
What does Cyan mean? → · Spring Shower color name →
#ABDCEE
oklch(0.866 0.056 222.4)
색상 변환
- HEX
- #abdcee
- RGB
- rgb(171 220 238)
- HSL
- hsl(196 66% 80%)
- HWB
- hwb(196 67% 7%)
- OKLCH
- oklch(0.866 0.056 222.4)
- OKLab
- oklab(0.866 -0.042 -0.038)
- CIE Lab
- lab(84.77 -13.36 -14.3)
- LCH
- lch(84.77 19.57 227)
- CMYK
- cmyk(28% 8% 0% 7%)
틴트 · 셰이드 · 톤
틴트
- B4E0F0
- BCE3F2
- C5E7F3
- CDEAF5
- D6EEF7
- DEF1F8
- E6F5FA
- EEF8FC
- F7FCFD
셰이드
- 94BFCF
- 7EA3B1
- 688893
- 546E77
- 40545C
- 2D3C42
- 1B262A
- 0B1114
- 010203
톤
- A7D2E3
- A3C9D7
- 9FC0CC
- 9AB6C1
- 96ADB6
- 92A4AB
- 8D9BA0
- 899295
- 85898A
색 조화
보색 +180°
- ABDCEE
Spring Shower
- F4C8B6
≈ Taco
유사색 -30° +30°
- ABDCEE
Spring Shower
- A8DFDD
≈ High Altitude
- B9D6F8
≈ Oh Boy!
삼각 배색 +120° +240°
- ABDCEE
Spring Shower
- EEC5DD
≈ Pink Odyssey
- DAD5AB
≈ Dull Sage
분열 보색 +150° +210°
- ABDCEE
Spring Shower
- F6C4C9
≈ Old Fashioned Pink
- EBCEAB
≈ Sheriff
사각 배색 +90° +180° +270°
- ABDCEE
Spring Shower
- E0C9EE
≈ Syrian Violet
- F4C8B6
≈ Taco
- C5DBB6
≈ White Vienna
대비 및 접근성
Ag
Fail흰색 위
WCAG 1.47:1 · APCA Lc 23
Ag
AAA검은색 위
WCAG 14.20:1 · APCA Lc 81
가장 좋은 글자색: #000000
WCAG 14.20:1 (AAA) · APCA Lc 81
Contrast pairs
코드 스니펫
CSS
:root {
--spring-shower: #abdcee;
--spring-shower-rgb: 171 220 238;
--spring-shower-oklch: oklch(0.866 0.056 222.4);
}
.element {
color: var(--spring-shower);
background-color: hsl(196 66% 80%);
border-color: oklch(0.866 0.056 222.4);
}Tailwind CSS v4
@theme {
--color-spring-shower: #abdcee;
--color-spring-shower-50: #e5f9ff;
--color-spring-shower-100: #d5ecf6;
--color-spring-shower-200: #bbdae6;
--color-spring-shower-300: #99becd;
--color-spring-shower-400: #7aa6b7;
--color-spring-shower-500: #5b8fa1;
--color-spring-shower-600: #4d7988;
--color-spring-shower-700: #3e616d;
--color-spring-shower-800: #2b4750;
--color-spring-shower-900: #1d3138;
--color-spring-shower-950: #0d1d22;
}SCSS
$spring-shower: #abdcee;
$spring-shower-rgb: 171, 220, 238;
$spring-shower-light: mix(#fff, $spring-shower, 20%);
$spring-shower-dark: mix(#000, $spring-shower, 20%);
.element {
color: $spring-shower;
box-shadow: 0 0 0 2px rgba($spring-shower, 0.35);
}