이름 색상 · #C4DBCB
Clearly Aqua
Clearly Aqua은(는) #C4DBCB: rgb(196 219 203), hsl(138 24% 81%), oklch(0.87 0.033 155.3). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
What does Gray mean? → · Clearly Aqua color name →
#C4DBCB
oklch(0.87 0.033 155.3)
색상 변환
- HEX
- #c4dbcb
- RGB
- rgb(196 219 203)
- HSL
- hsl(138 24% 81%)
- HWB
- hwb(138 77% 14%)
- OKLCH
- oklch(0.87 0.033 155.3)
- OKLab
- oklab(0.87 -0.03 0.014)
- CIE Lab
- lab(85.34 -10.21 5.16)
- LCH
- lch(85.34 11.44 153.2)
- CMYK
- cmyk(11% 0% 7% 14%)
틴트 · 셰이드 · 톤
틴트
- CADFD0
- D0E2D5
- D6E6DA
- DBE9E0
- E1EDE5
- E7F1EA
- EDF4EF
- F3F8F4
- F9FBFA
셰이드
- AABEB0
- 91A296
- 78877D
- 616D65
- 4A544D
- 353C37
- 212622
- 0E110F
- 020202
톤
- BDD2C3
- B6C8BC
- AFBFB4
- A8B6AC
- A1ACA5
- 9BA39D
- 949A96
- 8D918F
- 878987
색 조화
보색 +180°
- C4DBCB
Clearly Aqua
- E3CCDD
≈ Naughty Marietta
유사색 -30° +30°
- C4DBCB
Clearly Aqua
- CFD8C1
≈ Turtle Chalk
- BDDCD7
≈ Meander Blue
삼각 배색 +120° +240°
- C4DBCB
Clearly Aqua
- CED3EA
≈ Artistic Violet
- E9CDC6
≈ Mosaic Pink
분열 보색 +150° +210°
- C4DBCB
Clearly Aqua
- D9CFE6
≈ Plum’s the Word
- E8CCD1
≈ Cool Pink
사각 배색 +90° +180° +270°
- C4DBCB
Clearly Aqua
- C3D7E9
≈ Touch of Blue
- E3CCDD
≈ Naughty Marietta
- E4D0BE
≈ Ice Cream Cone
대비 및 접근성
Ag
Fail흰색 위
WCAG 1.46:1 · APCA Lc 22
Ag
AAA검은색 위
WCAG 14.34:1 · APCA Lc 81
가장 좋은 글자색: #000000
WCAG 14.34:1 (AAA) · APCA Lc 81
Contrast pairs
코드 스니펫
CSS
:root {
--clearly-aqua: #c4dbcb;
--clearly-aqua-rgb: 196 219 203;
--clearly-aqua-oklch: oklch(0.87 0.033 155.3);
}
.element {
color: var(--clearly-aqua);
background-color: hsl(138 24% 81%);
border-color: oklch(0.87 0.033 155.3);
}Tailwind CSS v4
@theme {
--color-clearly-aqua: #c4dbcb;
--color-clearly-aqua-50: #eef8f1;
--color-clearly-aqua-100: #dfebe4;
--color-clearly-aqua-200: #c9d9cf;
--color-clearly-aqua-300: #aabdb1;
--color-clearly-aqua-400: #90a596;
--color-clearly-aqua-500: #758d7d;
--color-clearly-aqua-600: #64776a;
--color-clearly-aqua-700: #4f5f54;
--color-clearly-aqua-800: #3a463d;
--color-clearly-aqua-900: #28302a;
--color-clearly-aqua-950: #161d18;
}SCSS
$clearly-aqua: #c4dbcb;
$clearly-aqua-rgb: 196, 219, 203;
$clearly-aqua-light: mix(#fff, $clearly-aqua, 20%);
$clearly-aqua-dark: mix(#000, $clearly-aqua, 20%);
.element {
color: $clearly-aqua;
box-shadow: 0 0 0 2px rgba($clearly-aqua, 0.35);
}