命名颜色 · #4400FF
Overdue Blue
Overdue Blue 即 #4400FF：rgb(68 0 255)、hsl(256 100% 50%)、oklch(0.476 0.3 274.9)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Blue mean? → · Overdue Blue color name →
#4400FF
oklch(0.476 0.3 274.9)
颜色转换
- HEX
- #4400ff
- RGB
- rgb(68 0 255)
- HSL
- hsl(256 100% 50%)
- HWB
- hwb(256 0% 0%)
- OKLCH
- oklch(0.476 0.3 274.9)
- OKLab
- oklab(0.476 0.026 -0.298)
- CIE Lab
- lab(32.59 69.99 -106.9)
- LCH
- lch(32.59 127.77 303.2)
- CMYK
- cmyk(73% 100% 0% 0%)
浅色调 · 深色调 · 灰色调
浅色调
- 4D40FF
- 5A5EFF
- 6A76FF
- 7C8CFF
- 8FA1FF
- A4B4FF
- BAC7FF
- D0DAFF
- E7EDFF
深色调
- 3A00DE
- 3000BE
- 26009E
- 1D0080
- 140063
- 0C0048
- 05002E
- 020016
- 000003
灰色调
- 452EF3
- 4741E8
- 4B4FDC
- 505AD0
- 5763C3
- 5E6AB7
- 6671AA
- 6E769D
- 777C8F
配色和谐
互补色 +180°
- 4400FF
Overdue Blue
- 6E5B00
≈ Hot Mustard
类似色 -30° +30°
- 4400FF
Overdue Blue
- 00619B
≈ Rave Regatta
- 7F00C8
≈ French Violet
三角配色 +120° +240°
- 4400FF
Overdue Blue
- A62800
≈ Rust Red
- 006F3E
≈ Dartmouth Green
分裂互补色 +150° +210°
- 4400FF
Overdue Blue
- 854E00
≈ Medium Brown
- 4D6700
≈ Serrano Pepper
四角配色 +90° +180° +270°
- 4400FF
Overdue Blue
- AB004E
≈ Shy Guy Red
- 6E5B00
≈ Hot Mustard
- 006C63
≈ Office Blue Green
对比度与无障碍
Ag
AAA白底
WCAG 7.80:1 · APCA Lc 84
Ag
Fail黑底
WCAG 2.68:1 · APCA Lc 18
最佳文字颜色: #FFFFFF
WCAG 7.80:1 (AAA) · APCA Lc 84
Contrast pairs
代码片段
CSS
:root {
--overdue-blue: #4400ff;
--overdue-blue-rgb: 68 0 255;
--overdue-blue-oklch: oklch(0.476 0.3 274.9);
}
.element {
color: var(--overdue-blue);
background-color: hsl(256 100% 50%);
border-color: oklch(0.476 0.3 274.9);
}Tailwind CSS v4
@theme {
--color-overdue-blue: #4400ff;
--color-overdue-blue-50: #dfeeff;
--color-overdue-blue-100: #cfdeff;
--color-overdue-blue-200: #b6c5ff;
--color-overdue-blue-300: #969fff;
--color-overdue-blue-400: #757bff;
--color-overdue-blue-500: #614aff;
--color-overdue-blue-600: #5142ff;
--color-overdue-blue-700: #4035dd;
--color-overdue-blue-800: #2927a7;
--color-overdue-blue-900: #1b1b77;
--color-overdue-blue-950: #0e0754;
}SCSS
$overdue-blue: #4400ff;
$overdue-blue-rgb: 68, 0, 255;
$overdue-blue-light: mix(#fff, $overdue-blue, 20%);
$overdue-blue-dark: mix(#000, $overdue-blue, 20%);
.element {
color: $overdue-blue;
box-shadow: 0 0 0 2px rgba($overdue-blue, 0.35);
}