最接近的命名颜色 · #30458B
#30458B
最接近的命名颜色: Pacific Navy
#30458B（rgb(48 69 139)、hsl(226 49% 37%)、oklch(0.413 0.119 268.3)）最接近命名颜色 Pacific Navy。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
#30458B
oklch(0.413 0.119 268.3)
颜色转换
- HEX
- #30458b
- RGB
- rgb(48 69 139)
- HSL
- hsl(226 49% 37%)
- HWB
- hwb(226 19% 45%)
- OKLCH
- oklch(0.413 0.119 268.3)
- OKLab
- oklab(0.413 -0.004 -0.119)
- CIE Lab
- lab(30.61 10.35 -42.34)
- LCH
- lch(30.61 43.58 283.7)
- CMYK
- cmyk(65% 50% 0% 45%)
浅色调 · 深色调 · 灰色调
浅色调
- 425797
- 5469A3
- 687BAF
- 7C8DBB
- 91A0C6
- A6B2D2
- BBC5DD
- D1D8E9
- E8EBF4
深色调
- 283B78
- 213166
- 1A2754
- 131E43
- 0C1532
- 060C23
- 030514
- 010207
- 000001
灰色调
- 374C8B
- 3F528A
- 475889
- 4E5E89
- 566488
- 5F6A87
- 676F85
- 6F7584
- 787B82
配色和谐
互补色 +180°
- 30458B
Pacific Navy
- 5E4800
≈ Mud Brown
类似色 -30° +30°
- 30458B
Pacific Navy
- 005177
≈ Pirate’s Haven
- 543982
≈ Kingfisher Daisy
三角配色 +120° +240°
- 30458B
Pacific Navy
- 7F2A23
≈ Posh Red
- 005C22
≈ Sombre Green
分裂互补色 +150° +210°
- 30458B
Pacific Navy
- 713B00
≈ Philippine Bronze
- 475200
≈ Highlands Moss
四角配色 +90° +180° +270°
- 30458B
Pacific Navy
- 7B294A
≈ Red Plum
- 5E4800
≈ Mud Brown
- 00584B
≈ Forest Shadows
对比度与无障碍
Ag
AAA白底
WCAG 8.93:1 · APCA Lc 90
Ag
Fail黑底
WCAG 2.34:1 · APCA Lc 12
最佳文字颜色: #FFFFFF
WCAG 8.93:1 (AAA) · APCA Lc 90
Contrast pairs
代码片段
CSS
:root {
--pacific-navy: #30458b;
--pacific-navy-rgb: 48 69 139;
--pacific-navy-oklch: oklch(0.413 0.119 268.3);
}
.element {
color: var(--pacific-navy);
background-color: hsl(226 49% 37%);
border-color: oklch(0.413 0.119 268.3);
}Tailwind CSS v4
@theme {
--color-pacific-navy: #30458b;
--color-pacific-navy-50: #e8f4ff;
--color-pacific-navy-100: #d8e7ff;
--color-pacific-navy-200: #c0d2ff;
--color-pacific-navy-300: #a0b5f5;
--color-pacific-navy-400: #819be5;
--color-pacific-navy-500: #6581d5;
--color-pacific-navy-600: #566db4;
--color-pacific-navy-700: #445890;
--color-pacific-navy-800: #2f406c;
--color-pacific-navy-900: #202c4c;
--color-pacific-navy-950: #101932;
}SCSS
$pacific-navy: #30458b;
$pacific-navy-rgb: 48, 69, 139;
$pacific-navy-light: mix(#fff, $pacific-navy, 20%);
$pacific-navy-dark: mix(#000, $pacific-navy, 20%);
.element {
color: $pacific-navy;
box-shadow: 0 0 0 2px rgba($pacific-navy, 0.35);
}