가장 가까운 이름 색상 · #4BA2DC
#4BA2DC
가장 가까운 이름 색상: High Blue
#4BA2DC(rgb(75 162 220), hsl(204 67% 58%), oklch(0.684 0.12 240.9))와 가장 가까운 이름 색상은 High Blue입니다. 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
#4BA2DC
oklch(0.684 0.12 240.9)
색상 변환
- HEX
- #4ba2dc
- RGB
- rgb(75 162 220)
- HSL
- hsl(204 67% 58%)
- HWB
- hwb(204 29% 14%)
- OKLCH
- oklch(0.684 0.12 240.9)
- OKLab
- oklab(0.684 -0.058 -0.104)
- CIE Lab
- lab(63.18 -13.29 -37.88)
- LCH
- lch(63.18 40.15 250.7)
- CMYK
- cmyk(66% 26% 0% 14%)
틴트 · 셰이드 · 톤
틴트
- 60ABE0
- 73B5E4
- 86BEE8
- 97C8EB
- A9D1EF
- BADAF2
- CBE3F6
- DDEDF9
- EEF6FC
셰이드
- 408CBF
- 3577A3
- 2B6388
- 214F6E
- 173C54
- 0E2A3C
- 061926
- 020A11
- 000102
톤
- 539FD3
- 5A9CCA
- 6198C0
- 6795B7
- 6C92AE
- 708EA5
- 758B9C
- 798792
- 7D8489
색 조화
보색 +180°
- 4BA2DC
High Blue
- CE8745
≈ Raw Linen
유사색 -30° +30°
- 4BA2DC
High Blue
- 00ACC3
≈ Sarah’s Garden
- 7E94E3
≈ Portage
삼각 배색 +120° +240°
- 4BA2DC
High Blue
- D57895
≈ Minuette
- 8FA44A
≈ Arathi Highlands
분열 보색 +150° +210°
- 4BA2DC
High Blue
- D97C6B
≈ Lei Flower
- B59634
≈ Mana
사각 배색 +90° +180° +270°
- 4BA2DC
High Blue
- C37DBB
≈ Lavender Sweater
- CE8745
≈ Raw Linen
- 5CAE72
≈ Pale Green
대비 및 접근성
Ag
Fail흰색 위
WCAG 2.79:1 · APCA Lc 54
Ag
AAA검은색 위
WCAG 7.50:1 · APCA Lc 48
가장 좋은 글자색: #000000
WCAG 7.50:1 (AAA) · APCA Lc 48
Contrast pairs
코드 스니펫
CSS
:root {
--high-blue: #4ba2dc;
--high-blue-rgb: 75 162 220;
--high-blue-oklch: oklch(0.684 0.12 240.9);
}
.element {
color: var(--high-blue);
background-color: hsl(204 67% 58%);
border-color: oklch(0.684 0.12 240.9);
}Tailwind CSS v4
@theme {
--color-high-blue: #4ba2dc;
--color-high-blue-50: #d9faff;
--color-high-blue-100: #c6edff;
--color-high-blue-200: #a8dbff;
--color-high-blue-300: #80bff0;
--color-high-blue-400: #56a7de;
--color-high-blue-500: #248ecd;
--color-high-blue-600: #2279ad;
--color-high-blue-700: #1b618b;
--color-high-blue-800: #0e4767;
--color-high-blue-900: #093148;
--color-high-blue-950: #001d2f;
}SCSS
$high-blue: #4ba2dc;
$high-blue-rgb: 75, 162, 220;
$high-blue-light: mix(#fff, $high-blue, 20%);
$high-blue-dark: mix(#000, $high-blue, 20%);
.element {
color: $high-blue;
box-shadow: 0 0 0 2px rgba($high-blue, 0.35);
}