命名颜色 · #4411EE
Royal Hunter Blue
Royal Hunter Blue 即 #4411EE：rgb(68 17 238)、hsl(254 87% 50%)、oklch(0.462 0.279 276.2)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Blue mean? → · Royal Hunter Blue color name →
#4411EE
oklch(0.462 0.279 276.2)
颜色转换
- HEX
- #4411ee
- RGB
- rgb(68 17 238)
- HSL
- hsl(254 87% 50%)
- HWB
- hwb(254 7% 7%)
- OKLCH
- oklch(0.462 0.279 276.2)
- OKLab
- oklab(0.462 0.03 -0.277)
- CIE Lab
- lab(31.51 63.93 -99.12)
- LCH
- lch(31.51 117.95 302.8)
- CMYK
- cmyk(71% 93% 0% 7%)
浅色调 · 深色调 · 灰色调
浅色调
- 4E41F2
- 5B5DF6
- 6C75FA
- 7E8AFC
- 919FFF
- A6B3FF
- BBC6FF
- D1D9FF
- E8ECFF
深色调
- 3A0DCF
- 3009B1
- 260693
- 1D0477
- 14025C
- 0C0142
- 05002A
- 020014
- 000003
灰色调
- 4530E4
- 4841DA
- 4C4ED0
- 5258C6
- 5861BB
- 5F69B0
- 676FA5
- 6F7699
- 777B8D
配色和谐
互补色 +180°
- 4411EE
Royal Hunter Blue
- 685800
≈ Ayahuasca Vine
类似色 -30° +30°
- 4411EE
Royal Hunter Blue
- 005C96
≈ Jetski Race
- 7B00BD
≈ Violet Poison
三角配色 +120° +240°
- 4411EE
Royal Hunter Blue
- 9D2900
≈ Burnt Red
- 006A3D
≈ Frog Green
分裂互补色 +150° +210°
- 4411EE
Royal Hunter Blue
- 7E4B00
≈ Gédéon Brown
- 486300
≈ Camouflage Green
四角配色 +90° +180° +270°
- 4411EE
Royal Hunter Blue
- A40048
≈ Cherry Plum
- 685800
≈ Ayahuasca Vine
- 00675F
≈ Butterfly Green
对比度与无障碍
Ag
AAA白底
WCAG 8.20:1 · APCA Lc 86
Ag
Fail黑底
WCAG 2.56:1 · APCA Lc 16
最佳文字颜色: #FFFFFF
WCAG 8.20:1 (AAA) · APCA Lc 86
Contrast pairs
代码片段
CSS
:root {
--royal-hunter-blue: #4411ee;
--royal-hunter-blue-rgb: 68 17 238;
--royal-hunter-blue-oklch: oklch(0.462 0.279 276.2);
}
.element {
color: var(--royal-hunter-blue);
background-color: hsl(254 87% 50%);
border-color: oklch(0.462 0.279 276.2);
}Tailwind CSS v4
@theme {
--color-royal-hunter-blue: #4411ee;
--color-royal-hunter-blue-50: #e2eeff;
--color-royal-hunter-blue-100: #d2deff;
--color-royal-hunter-blue-200: #bac5ff;
--color-royal-hunter-blue-300: #9ba1ff;
--color-royal-hunter-blue-400: #7b7fff;
--color-royal-hunter-blue-500: #6653ff;
--color-royal-hunter-blue-600: #5649ff;
--color-royal-hunter-blue-700: #443ad3;
--color-royal-hunter-blue-800: #2d2ba0;
--color-royal-hunter-blue-900: #1e1d72;
--color-royal-hunter-blue-950: #100a50;
}SCSS
$royal-hunter-blue: #4411ee;
$royal-hunter-blue-rgb: 68, 17, 238;
$royal-hunter-blue-light: mix(#fff, $royal-hunter-blue, 20%);
$royal-hunter-blue-dark: mix(#000, $royal-hunter-blue, 20%);
.element {
color: $royal-hunter-blue;
box-shadow: 0 0 0 2px rgba($royal-hunter-blue, 0.35);
}