最接近的命名颜色 · #4B63A3
#4B63A3
最接近的命名颜色: Starstruck
#4B63A3(rgb(75 99 163)、hsl(224 37% 47%)、oklch(0.511 0.106 267.1))最接近命名颜色 Starstruck。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度,以及 CSS、Tailwind v4 和 SCSS 代码。
#4B63A3
oklch(0.511 0.106 267.1)
颜色转换
- HEX
- #4b63a3
- RGB
- rgb(75 99 163)
- HSL
- hsl(224 37% 47%)
- HWB
- hwb(224 29% 36%)
- OKLCH
- oklch(0.511 0.106 267.1)
- OKLab
- oklab(0.511 -0.005 -0.106)
- CIE Lab
- lab(42.35 5.6 -37.99)
- LCH
- lch(42.35 38.4 278.4)
- CMYK
- cmyk(54% 39% 0% 36%)
浅色调 · 深色调 · 灰色调
浅色调
- 5B72AD
- 6C81B6
- 7D90C0
- 8FA0C9
- A1AFD2
- B3BFDB
- C5CFE4
- D8DFED
- ECEFF6
深色调
- 40558D
- 354778
- 2B3A63
- 212E4F
- 17213C
- 0E162A
- 060B19
- 02030A
- 000001
灰色调
- 5066A0
- 556A9D
- 5B6D9A
- 607096
- 657393
- 6A758F
- 70788C
- 757B88
- 7B7D84
配色和谐
互补色 +180°
- 4B63A3
Starstruck
- 806100
≈ Ground Earth
类似色 -30° +30°
- 4B63A3
Starstruck
- 126E9B
≈ Disarm
- 6D589B
≈ Rollick
三角配色 +120° +240°
- 4B63A3
Starstruck
- 9A4C44
≈ Safflower Kite
- 377641
≈ Cucumber Queen
分裂互补色 +150° +210°
- 4B63A3
Starstruck
- 93551F
≈ Sugar Almond
- 626E1A
≈ Fiji Green
四角配色 +90° +180° +270°
- 4B63A3
Starstruck
- 954A67
≈ Glitterati
- 806100
≈ Ground Earth
- 007865
≈ Shady Glade
对比度与无障碍
Ag
AA白底
WCAG 5.81:1 · APCA Lc 79
Ag
Fail黑底
WCAG 3.61:1 · APCA Lc 23
最佳文字颜色: #FFFFFF
WCAG 5.81:1 (AA) · APCA Lc 79
Contrast pairs
代码片段
CSS
:root {
--starstruck: #4b63a3;
--starstruck-rgb: 75 99 163;
--starstruck-oklch: oklch(0.511 0.106 267.1);
}
.element {
color: var(--starstruck);
background-color: hsl(224 37% 47%);
border-color: oklch(0.511 0.106 267.1);
}Tailwind CSS v4
@theme {
--color-starstruck: #4b63a3;
--color-starstruck-50: #e9f5ff;
--color-starstruck-100: #d9e7ff;
--color-starstruck-200: #c2d3ff;
--color-starstruck-300: #a1b6ef;
--color-starstruck-400: #829cde;
--color-starstruck-500: #6783cc;
--color-starstruck-600: #576fad;
--color-starstruck-700: #45598b;
--color-starstruck-800: #304167;
--color-starstruck-900: #212d48;
--color-starstruck-950: #101a2f;
}SCSS
$starstruck: #4b63a3;
$starstruck-rgb: 75, 99, 163;
$starstruck-light: mix(#fff, $starstruck, 20%);
$starstruck-dark: mix(#000, $starstruck, 20%);
.element {
color: $starstruck;
box-shadow: 0 0 0 2px rgba($starstruck, 0.35);
}