命名颜色 · #6193B4
Empire Blue
Empire Blue 即 #6193B4：rgb(97 147 180)、hsl(204 36% 54%)、oklch(0.641 0.073 238.4)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Blue mean? → · Empire Blue color name →
#6193B4
oklch(0.641 0.073 238.4)
颜色转换
- HEX
- #6193b4
- RGB
- rgb(97 147 180)
- HSL
- hsl(204 36% 54%)
- HWB
- hwb(204 38% 29%)
- OKLCH
- oklch(0.641 0.073 238.4)
- OKLab
- oklab(0.641 -0.038 -0.062)
- CIE Lab
- lab(58.36 -10.53 -22.91)
- LCH
- lch(58.36 25.21 245.3)
- CMYK
- cmyk(46% 18% 0% 29%)
浅色调 · 深色调 · 灰色调
浅色调
- 719EBC
- 80A8C3
- 90B3CB
- A0BDD2
- AFC8DA
- BFD3E1
- CFDEE9
- DFE9F0
- EFF4F8
深色调
- 537F9C
- 466C85
- 39596E
- 2D4758
- 213644
- 152530
- 0B161D
- 03080C
- 000102
灰色调
- 6591AF
- 698FAA
- 6C8EA4
- 6F8C9F
- 728A9A
- 758895
- 788690
- 7B848B
- 7D8285
配色和谐
互补色 +180°
- 6193B4
Empire Blue
- AE825F
≈ Sylvaneth Bark
类似色 -30° +30°
- 6193B4
Empire Blue
- 5299A4
≈ Tropical Oasis
- 798BBA
≈ Larkspur Bouquet
三角配色 +120° +240°
- 6193B4
Empire Blue
- B17A8C
≈ Foxglove
- 88935F
≈ Epsom
分裂互补色 +150° +210°
- 6193B4
Empire Blue
- B57B73
≈ Heirloom
- 9F8A57
≈ Goldbrown
四角配色 +90° +180° +270°
- 6193B4
Empire Blue
- A57DA3
≈ Wild Lavender
- AE825F
≈ Sylvaneth Bark
- 6D9974
≈ Oxley
对比度与无障碍
Ag
Fail白底
WCAG 3.31:1 · APCA Lc 60
Ag
AA黑底
WCAG 6.34:1 · APCA Lc 41
最佳文字颜色: #000000
WCAG 6.34:1 (AA) · APCA Lc 41
Contrast pairs
代码片段
CSS
:root {
--empire-blue: #6193b4;
--empire-blue-rgb: 97 147 180;
--empire-blue-oklch: oklch(0.641 0.073 238.4);
}
.element {
color: var(--empire-blue);
background-color: hsl(204 36% 54%);
border-color: oklch(0.641 0.073 238.4);
}Tailwind CSS v4
@theme {
--color-empire-blue: #6193b4;
--color-empire-blue-50: #e3f9ff;
--color-empire-blue-100: #d3ecfe;
--color-empire-blue-200: #b9d9f1;
--color-empire-blue-300: #96bdda;
--color-empire-blue-400: #75a5c5;
--color-empire-blue-500: #558db1;
--color-empire-blue-600: #497796;
--color-empire-blue-700: #3a6078;
--color-empire-blue-800: #284658;
--color-empire-blue-900: #1b313e;
--color-empire-blue-950: #0b1d27;
}SCSS
$empire-blue: #6193b4;
$empire-blue-rgb: 97, 147, 180;
$empire-blue-light: mix(#fff, $empire-blue, 20%);
$empire-blue-dark: mix(#000, $empire-blue, 20%);
.element {
color: $empire-blue;
box-shadow: 0 0 0 2px rgba($empire-blue, 0.35);
}