最接近的命名颜色 · #576290
#576290
最接近的命名颜色: Wizard’s Potion
#576290（rgb(87 98 144)、hsl(228 25% 45%)、oklch(0.506 0.075 273.2)）最接近命名颜色 Wizard’s Potion。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
#576290
oklch(0.506 0.075 273.2)
颜色转换
- HEX
- #576290
- RGB
- rgb(87 98 144)
- HSL
- hsl(228 25% 45%)
- HWB
- hwb(228 34% 44%)
- OKLCH
- oklch(0.506 0.075 273.2)
- OKLab
- oklab(0.506 0.004 -0.074)
- CIE Lab
- lab(42.1 4.95 -27.04)
- LCH
- lch(42.1 27.49 280.4)
- CMYK
- cmyk(40% 32% 0% 44%)
浅色调 · 深色调 · 灰色调
浅色调
- 66719B
- 7680A6
- 868FB1
- 969EBC
- A7AEC7
- B8BED2
- C9CEDE
- DBDEE9
- EDEEF4
深色调
- 4B547D
- 3E476A
- 333A57
- 272D45
- 1C2134
- 121624
- 080B15
- 030307
- 000001
灰色调
- 5B658F
- 5F688D
- 636B8C
- 676E8A
- 6B7189
- 6F7487
- 737786
- 787A84
- 7C7D82
配色和谐
互补色 +180°
- 576290
Wizard’s Potion
- 74642F
≈ Himalaya
类似色 -30° +30°
- 576290
Wizard’s Potion
- 3D6A8D
≈ Rainy Lake
- 6E5A88
≈ Emperor Jewel
三角配色 +120° +240°
- 576290
Wizard’s Potion
- 8A5549
≈ Potter’s Rock
- 417251
≈ Fairway
分裂互补色 +150° +210°
- 576290
Wizard’s Potion
- 835B36
≈ Rubber
- 5D6C3B
≈ Globe Artichoke
四角配色 +90° +180° +270°
- 576290
Wizard’s Potion
- 895361
≈ Berry Smoothie
- 74642F
≈ Himalaya
- 287369
≈ Advantageous
对比度与无障碍
Ag
AA白底
WCAG 5.90:1 · APCA Lc 80
Ag
Fail黑底
WCAG 3.55:1 · APCA Lc 22
最佳文字颜色: #FFFFFF
WCAG 5.90:1 (AA) · APCA Lc 80
Contrast pairs
代码片段
CSS
:root {
--wizard-s-potion: #576290;
--wizard-s-potion-rgb: 87 98 144;
--wizard-s-potion-oklch: oklch(0.506 0.075 273.2);
}
.element {
color: var(--wizard-s-potion);
background-color: hsl(228 25% 45%);
border-color: oklch(0.506 0.075 273.2);
}Tailwind CSS v4
@theme {
--color-wizard-s-potion: #576290;
--color-wizard-s-potion-50: #eff4ff;
--color-wizard-s-potion-100: #e0e7ff;
--color-wizard-s-potion-200: #cbd2f5;
--color-wizard-s-potion-300: #acb5de;
--color-wizard-s-potion-400: #909ccb;
--color-wizard-s-potion-500: #7683b8;
--color-wizard-s-potion-600: #646f9b;
--color-wizard-s-potion-700: #50597d;
--color-wizard-s-potion-800: #39415d;
--color-wizard-s-potion-900: #272d41;
--color-wizard-s-potion-950: #151a29;
}SCSS
$wizard-s-potion: #576290;
$wizard-s-potion-rgb: 87, 98, 144;
$wizard-s-potion-light: mix(#fff, $wizard-s-potion, 20%);
$wizard-s-potion-dark: mix(#000, $wizard-s-potion, 20%);
.element {
color: $wizard-s-potion;
box-shadow: 0 0 0 2px rgba($wizard-s-potion, 0.35);
}