이름 색상 · #ABC4DB
Blue Prism
Blue Prism은(는) #ABC4DB: rgb(171 196 219), hsl(209 40% 76%), oklch(0.809 0.042 246.1). 틴트, 셰이드, 색 조화, WCAG·APCA 대비, CSS·Tailwind v4·SCSS 코드를 확인하세요.
What does Blue mean? → · Blue Prism color name →
#ABC4DB
oklch(0.809 0.042 246.1)
색상 변환
- HEX
- #abc4db
- RGB
- rgb(171 196 219)
- HSL
- hsl(209 40% 76%)
- HWB
- hwb(209 67% 14%)
- OKLCH
- oklch(0.809 0.042 246.1)
- OKLab
- oklab(0.809 -0.017 -0.039)
- CIE Lab
- lab(77.83 -5.04 -14.51)
- LCH
- lch(77.83 15.36 250.9)
- CMYK
- cmyk(22% 11% 0% 14%)
틴트 · 셰이드 · 톤
틴트
- B3CADF
- BCD0E2
- C4D6E6
- CCDBEA
- D5E1ED
- DDE7F1
- E5EDF4
- EEF3F8
- F6F9FB
셰이드
- 94AABE
- 7E91A2
- 687887
- 54616D
- 404A54
- 2D353C
- 1B2126
- 0B0E11
- 010202
톤
- A7BDD2
- A2B6C8
- 9EAFBF
- 9AA8B6
- 95A1AD
- 919BA3
- 8D949B
- 898D92
- 848789
색 조화
보색 +180°
- ABC4DB
Blue Prism
- D4BCA4
≈ Nutty Beige
유사색 -30° +30°
- ABC4DB
Blue Prism
- A3C8D2
≈ Blue Dam
- B9BFDD
≈ Rhapsody Lilac
삼각 배색 +120° +240°
- ABC4DB
Blue Prism
- DAB6BC
≈ Strawberry Glaze
- BAC6A9
≈ Zion
분열 보색 +150° +210°
- ABC4DB
Blue Prism
- DAB8AE
≈ Pink Apatite
- C8C1A2
≈ Moth
사각 배색 +90° +180° +270°
- ABC4DB
Blue Prism
- D3B7CB
≈ Icing Flower
- D4BCA4
≈ Nutty Beige
- ABC9B5
≈ Gum Leaf
대비 및 접근성
Ag
Fail흰색 위
WCAG 1.80:1 · APCA Lc 33
Ag
AAA검은색 위
WCAG 11.65:1 · APCA Lc 69
가장 좋은 글자색: #000000
WCAG 11.65:1 (AAA) · APCA Lc 69
Contrast pairs
코드 스니펫
CSS
:root {
--blue-prism: #abc4db;
--blue-prism-rgb: 171 196 219;
--blue-prism-oklch: oklch(0.809 0.042 246.1);
}
.element {
color: var(--blue-prism);
background-color: hsl(209 40% 76%);
border-color: oklch(0.809 0.042 246.1);
}Tailwind CSS v4
@theme {
--color-blue-prism: #abc4db;
--color-blue-prism-50: #ecf7ff;
--color-blue-prism-100: #ddeaf6;
--color-blue-prism-200: #c7d6e6;
--color-blue-prism-300: #a7bacd;
--color-blue-prism-400: #8ba1b7;
--color-blue-prism-500: #6f89a1;
--color-blue-prism-600: #5f7488;
--color-blue-prism-700: #4b5d6d;
--color-blue-prism-800: #364450;
--color-blue-prism-900: #252f38;
--color-blue-prism-950: #131c22;
}SCSS
$blue-prism: #abc4db;
$blue-prism-rgb: 171, 196, 219;
$blue-prism-light: mix(#fff, $blue-prism, 20%);
$blue-prism-dark: mix(#000, $blue-prism, 20%);
.element {
color: $blue-prism;
box-shadow: 0 0 0 2px rgba($blue-prism, 0.35);
}