最接近的命名颜色 · #2BA4FF
#2BA4FF
最接近的命名颜色: Cerulean
#2BA4FF(rgb(43 164 255)、hsl(206 100% 58%)、oklch(0.698 0.168 246.9))最接近命名颜色 Cerulean。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度,以及 CSS、Tailwind v4 和 SCSS 代码。
#2BA4FF
oklch(0.698 0.168 246.9)
颜色转换
- HEX
- #2ba4ff
- RGB
- rgb(43 164 255)
- HSL
- hsl(206 100% 58%)
- HWB
- hwb(206 17% 0%)
- OKLCH
- oklch(0.698 0.168 246.9)
- OKLab
- oklab(0.698 -0.066 -0.154)
- CIE Lab
- lab(64.33 -8.75 -55.27)
- LCH
- lch(64.33 55.96 261)
- CMYK
- cmyk(83% 36% 0% 0%)
浅色调 · 深色调 · 灰色调
浅色调
- 4BAEFF
- 63B7FF
- 79C1FF
- 8DCAFF
- A1D3FF
- B4DCFF
- C7E5FF
- DAEEFF
- ECF6FF
深色调
- 248EDE
- 1D79BE
- 16649E
- 105080
- 0A3D63
- 052B48
- 021A2E
- 010A16
- 000103
灰色调
- 3CA1F2
- 499EE5
- 539BD9
- 5C97CC
- 6494BF
- 6B90B3
- 718CA6
- 76889A
- 7B848D
配色和谐
互补色 +180°
- 2BA4FF
Cerulean
- DC8700
≈ Fleur de Sel Caramel
类似色 -30° +30°
- 2BA4FF
Cerulean
- 00B0D0
≈ Aquarius
- 8691FF
≈ Lavender Blue Shadow
三角配色 +120° +240°
- 2BA4FF
Cerulean
- F16A8C
≈ Cupid’s Arrow
- 82B023
≈ Football Field
分裂互补色 +150° +210°
- 2BA4FF
Cerulean
- F3724C
≈ Fiery Sky
- B79D00
≈ Perennial
四角配色 +90° +180° +270°
对比度与无障碍
Ag
Fail白底
WCAG 2.67:1 · APCA Lc 51
Ag
AAA黑底
WCAG 7.85:1 · APCA Lc 50
最佳文字颜色: #000000
WCAG 7.85:1 (AAA) · APCA Lc 50
Contrast pairs
代码片段
CSS
:root {
--cerulean: #2ba4ff;
--cerulean-rgb: 43 164 255;
--cerulean-oklch: oklch(0.698 0.168 246.9);
}
.element {
color: var(--cerulean);
background-color: hsl(206 100% 58%);
border-color: oklch(0.698 0.168 246.9);
}Tailwind CSS v4
@theme {
--color-cerulean: #2ba4ff;
--color-cerulean-50: #d1faff;
--color-cerulean-100: #bdedff;
--color-cerulean-200: #9bdaff;
--color-cerulean-300: #6ebdff;
--color-cerulean-400: #37a5fb;
--color-cerulean-500: #008bed;
--color-cerulean-600: #0075c8;
--color-cerulean-700: #005ea1;
--color-cerulean-800: #004678;
--color-cerulean-900: #003054;
--color-cerulean-950: #001c39;
}SCSS
$cerulean: #2ba4ff;
$cerulean-rgb: 43, 164, 255;
$cerulean-light: mix(#fff, $cerulean, 20%);
$cerulean-dark: mix(#000, $cerulean, 20%);
.element {
color: $cerulean;
box-shadow: 0 0 0 2px rgba($cerulean, 0.35);
}