最接近的命名颜色 · #8268A9
#8268A9
最接近的命名颜色: Lavish Spending
#8268A9（rgb(130 104 169)、hsl(264 27% 54%)、oklch(0.569 0.101 301.7)）最接近命名颜色 Lavish Spending。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
#8268A9
oklch(0.569 0.101 301.7)
颜色转换
- HEX
- #8268a9
- RGB
- rgb(130 104 169)
- HSL
- hsl(264 27% 54%)
- HWB
- hwb(264 41% 34%)
- OKLCH
- oklch(0.569 0.101 301.7)
- OKLab
- oklab(0.569 0.053 -0.086)
- CIE Lab
- lab(48.63 21.01 -31.29)
- LCH
- lch(48.63 37.69 303.9)
- CMYK
- cmyk(23% 38% 0% 34%)
浅色调 · 深色调 · 灰色调
浅色调
- 8E77B2
- 9A85BB
- A694C3
- B2A3CC
- BEB2D5
- CBC1DD
- D8D0E6
- E5E0EE
- F2EFF7
深色调
- 705992
- 5F4B7C
- 4E3E67
- 3E3053
- 2F243F
- 20182C
- 120C1B
- 06040A
- 010001
灰色调
- 826BA5
- 816DA1
- 81709D
- 817299
- 817595
- 817791
- 80798D
- 807C89
- 807E84
配色和谐
互补色 +180°
- 8268A9
Lavish Spending
- 6D8037
≈ Leaps and Bounds
类似色 -30° +30°
- 8268A9
Lavish Spending
- 6273B3
≈ Wild Pansy
- 9A6092
≈ Kyo Purple
三角配色 +120° +240°
- 8268A9
Lavish Spending
- A26832
≈ Hot Ginger
- 048A7B
≈ Go Go Green
分裂互补色 +150° +210°
- 8268A9
Lavish Spending
- 8D7524
≈ Aubergine Green
- 448858
≈ Kilkenny
四角配色 +90° +180° +270°
- 8268A9
Lavish Spending
- AB5F51
≈ Trolley Dash
- 6D8037
≈ Leaps and Bounds
- 008699
≈ Marker Blue
对比度与无障碍
Ag
AA白底
WCAG 4.66:1 · APCA Lc 72
Ag
AA黑底
WCAG 4.50:1 · APCA Lc 29
最佳文字颜色: #FFFFFF
WCAG 4.66:1 (AA) · APCA Lc 72
Contrast pairs
代码片段
CSS
:root {
--lavish-spending: #8268a9;
--lavish-spending-rgb: 130 104 169;
--lavish-spending-oklch: oklch(0.569 0.101 301.7);
}
.element {
color: var(--lavish-spending);
background-color: hsl(264 27% 54%);
border-color: oklch(0.569 0.101 301.7);
}Tailwind CSS v4
@theme {
--color-lavish-spending: #8268a9;
--color-lavish-spending-50: #fbefff;
--color-lavish-spending-100: #efe0ff;
--color-lavish-spending-200: #ddcaf8;
--color-lavish-spending-300: #c2abe2;
--color-lavish-spending-400: #a990d1;
--color-lavish-spending-500: #9275be;
--color-lavish-spending-600: #7c63a1;
--color-lavish-spending-700: #634f81;
--color-lavish-spending-800: #483a60;
--color-lavish-spending-900: #322844;
--color-lavish-spending-950: #1e162c;
}SCSS
$lavish-spending: #8268a9;
$lavish-spending-rgb: 130, 104, 169;
$lavish-spending-light: mix(#fff, $lavish-spending, 20%);
$lavish-spending-dark: mix(#000, $lavish-spending, 20%);
.element {
color: $lavish-spending;
box-shadow: 0 0 0 2px rgba($lavish-spending, 0.35);
}