命名颜色 · #285991
Blue Regent
Blue Regent 即 #285991：rgb(40 89 145)、hsl(212 57% 36%)、oklch(0.459 0.106 253.6)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Blue mean? → · Blue Regent color name →
#285991
oklch(0.459 0.106 253.6)
颜色转换
- HEX
- #285991
- RGB
- rgb(40 89 145)
- HSL
- hsl(212 57% 36%)
- HWB
- hwb(212 16% 43%)
- OKLCH
- oklch(0.459 0.106 253.6)
- OKLab
- oklab(0.459 -0.03 -0.102)
- CIE Lab
- lab(36.65 -1.62 -36.41)
- LCH
- lch(36.65 36.45 267.4)
- CMYK
- cmyk(72% 39% 0% 43%)
浅色调 · 深色调 · 灰色调
浅色调
- 3E699C
- 5279A8
- 6789B3
- 7C99BE
- 91AAC9
- A6BBD4
- BCCBDF
- D2DCE9
- E8EEF4
深色调
- 214C7D
- 1B406A
- 153458
- 0F2846
- 091D35
- 041325
- 020915
- 010307
- 000001
灰色调
- 325D90
- 3C628F
- 45668D
- 4E6A8C
- 566E8A
- 5F7188
- 677586
- 6F7984
- 787C82
配色和谐
互补色 +180°
- 285991
Blue Regent
- 784E00
≈ Lucky Brown
类似色 -30° +30°
- 285991
Blue Regent
- 00617B
≈ Jamaican Dream
- 514E90
≈ Twilight
三角配色 +120° +240°
- 285991
Blue Regent
- 883B46
≈ Burnt Russet
- 3E6420
≈ Rainforest Matcha
分裂互补色 +150° +210°
- 285991
Blue Regent
- 874121
≈ Honey Garlic Beef
- 615A00
≈ Brussels Sprout Green
四角配色 +90° +180° +270°
- 285991
Blue Regent
- 7F3D67
≈ Midnight Aubergine
- 784E00
≈ Lucky Brown
- 006848
≈ Greens
对比度与无障碍
Ag
AAA白底
WCAG 7.17:1 · APCA Lc 85
Ag
Fail黑底
WCAG 2.92:1 · APCA Lc 17
最佳文字颜色: #FFFFFF
WCAG 7.17:1 (AAA) · APCA Lc 85
Contrast pairs
代码片段
CSS
:root {
--blue-regent: #285991;
--blue-regent-rgb: 40 89 145;
--blue-regent-oklch: oklch(0.459 0.106 253.6);
}
.element {
color: var(--blue-regent);
background-color: hsl(212 57% 36%);
border-color: oklch(0.459 0.106 253.6);
}Tailwind CSS v4
@theme {
--color-blue-regent: #285991;
--color-blue-regent-50: #e2f7ff;
--color-blue-regent-100: #d1eaff;
--color-blue-regent-200: #b7d7ff;
--color-blue-regent-300: #93baed;
--color-blue-regent-400: #71a2dc;
--color-blue-regent-500: #5189cb;
--color-blue-regent-600: #4574ab;
--color-blue-regent-700: #375d89;
--color-blue-regent-800: #254466;
--color-blue-regent-900: #192f48;
--color-blue-regent-950: #091b2f;
}SCSS
$blue-regent: #285991;
$blue-regent-rgb: 40, 89, 145;
$blue-regent-light: mix(#fff, $blue-regent, 20%);
$blue-regent-dark: mix(#000, $blue-regent, 20%);
.element {
color: $blue-regent;
box-shadow: 0 0 0 2px rgba($blue-regent, 0.35);
}