이름 색상 · #A1CAF1
Baby Blue Eyes
Baby Blue Eyes은(는) #A1CAF1: rgb(161 202 241), hsl(209 74% 79%), oklch(0.823 0.07 247.4). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
What does Blue mean? → · Baby Blue Eyes color name →
#A1CAF1
oklch(0.823 0.07 247.4)
색상 변환
- HEX
- #a1caf1
- RGB
- rgb(161 202 241)
- HSL
- hsl(209 74% 79%)
- HWB
- hwb(209 63% 5%)
- OKLCH
- oklch(0.823 0.07 247.4)
- OKLab
- oklab(0.823 -0.027 -0.065)
- CIE Lab
- lab(79.39 -7.13 -24.01)
- LCH
- lch(79.39 25.04 253.5)
- CMYK
- cmyk(33% 16% 0% 5%)
틴트 · 셰이드 · 톤
틴트
- AACFF3
- B4D5F4
- BDDAF6
- C7DFF7
- D0E5F9
- D9EAFA
- E3EFFB
- ECF4FD
- F6FAFE
셰이드
- 8BAFD2
- 7695B3
- 627C95
- 4E6479
- 3C4D5D
- 2A3743
- 19222B
- 090F14
- 010203
톤
- 9EC2E5
- 9BBBDA
- 98B3CE
- 94ACC3
- 91A5B7
- 8E9DAC
- 8A96A1
- 878E96
- 84878B
색 조화
보색 +180°
- A1CAF1
Baby Blue Eyes
- E4BD94
≈ Laksa
유사색 -30° +30°
- A1CAF1
Baby Blue Eyes
- 90D1E3
≈ July
- B9C2F3
≈ Vodka
삼각 배색 +120° +240°
- A1CAF1
Baby Blue Eyes
- EEB3BD
≈ Frozen Veins
- B8CE9D
≈ Fava Bean
분열 보색 +150° +210°
- A1CAF1
Baby Blue Eyes
- EEB6A5
≈ Plushy Pink
- D1C691
≈ Vast Escape
사각 배색 +90° +180° +270°
- A1CAF1
Baby Blue Eyes
- E4B4D6
≈ Pink Gems
- E4BD94
≈ Laksa
- 9FD3B3
≈ Menthol Green
대비 및 접근성
Ag
Fail흰색 위
WCAG 1.71:1 · APCA Lc 31
Ag
AAA검은색 위
WCAG 12.23:1 · APCA Lc 72
가장 좋은 글자색: #000000
WCAG 12.23:1 (AAA) · APCA Lc 72
Contrast pairs
코드 스니펫
CSS
:root {
--baby-blue-eyes: #a1caf1;
--baby-blue-eyes-rgb: 161 202 241;
--baby-blue-eyes-oklch: oklch(0.823 0.07 247.4);
}
.element {
color: var(--baby-blue-eyes);
background-color: hsl(209 74% 79%);
border-color: oklch(0.823 0.07 247.4);
}Tailwind CSS v4
@theme {
--color-baby-blue-eyes: #a1caf1;
--color-baby-blue-eyes-50: #e6f7ff;
--color-baby-blue-eyes-100: #d7eaff;
--color-baby-blue-eyes-200: #bed7f2;
--color-baby-blue-eyes-300: #9cbbdb;
--color-baby-blue-eyes-400: #7da3c6;
--color-baby-blue-eyes-500: #5f8bb3;
--color-baby-blue-eyes-600: #517597;
--color-baby-blue-eyes-700: #415e79;
--color-baby-blue-eyes-800: #2d4559;
--color-baby-blue-eyes-900: #1f303e;
--color-baby-blue-eyes-950: #0e1c28;
}SCSS
$baby-blue-eyes: #a1caf1;
$baby-blue-eyes-rgb: 161, 202, 241;
$baby-blue-eyes-light: mix(#fff, $baby-blue-eyes, 20%);
$baby-blue-eyes-dark: mix(#000, $baby-blue-eyes, 20%);
.element {
color: $baby-blue-eyes;
box-shadow: 0 0 0 2px rgba($baby-blue-eyes, 0.35);
}