命名颜色 · #AA1111
Büchel Cherry
Büchel Cherry 即 #AA1111：rgb(170 17 17)、hsl(0 82% 37%)、oklch(0.47 0.183 28.2)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Red mean? → · Büchel Cherry color name →
#AA1111
oklch(0.47 0.183 28.2)
颜色转换
- HEX
- #aa1111
- RGB
- rgb(170 17 17)
- HSL
- hsl(0 82% 37%)
- HWB
- hwb(0 7% 33%)
- OKLCH
- oklch(0.47 0.183 28.2)
- OKLab
- oklab(0.47 0.162 0.087)
- CIE Lab
- lab(36.71 57.65 44.71)
- LCH
- lch(36.71 72.95 37.8)
- CMYK
- cmyk(0% 90% 90% 33%)
浅色调 · 深色调 · 灰色调
浅色调
- B6362E
- C15045
- CB675C
- D47D72
- DD9389
- E5A9A0
- EDBEB7
- F4D4CF
- FAE9E7
深色调
- 930D0D
- 7D0909
- 680606
- 530404
- 3F0202
- 2D0101
- 1B0000
- 0B0000
- 010000
灰色调
- A82822
- A5372E
- A2433A
- 9F4E44
- 9B574F
- 976059
- 926963
- 8D716C
- 877876
配色和谐
互补色 +180°
- AA1111
Büchel Cherry
- 006773
≈ Kingfisher Bright
类似色 -30° +30°
- AA1111
Büchel Cherry
- A30F5A
≈ Banafsaji Purple
- 884800
≈ Chocolate Pancakes
三角配色 +120° +240°
- AA1111
Büchel Cherry
- 006E2A
≈ Enchanted Glen
- 314CC0
≈ Kikorangi Blue
分裂互补色 +150° +210°
- AA1111
Büchel Cherry
- 006A5B
≈ Fresh Ivy Green
- 00628E
≈ Pontoon
四角配色 +90° +180° +270°
- AA1111
Büchel Cherry
- 566200
≈ Serrano Pepper
- 006773
≈ Kingfisher Bright
- 6B37B1
≈ Purple Emperor
对比度与无障碍
Ag
AAA白底
WCAG 7.50:1 · APCA Lc 84
Ag
Fail黑底
WCAG 2.79:1 · APCA Lc 18
最佳文字颜色: #FFFFFF
WCAG 7.50:1 (AAA) · APCA Lc 84
Contrast pairs
代码片段
CSS
:root {
--buchel-cherry: #aa1111;
--buchel-cherry-rgb: 170 17 17;
--buchel-cherry-oklch: oklch(0.47 0.183 28.2);
}
.element {
color: var(--buchel-cherry);
background-color: hsl(0 82% 37%);
border-color: oklch(0.47 0.183 28.2);
}Tailwind CSS v4
@theme {
--color-buchel-cherry: #aa1111;
--color-buchel-cherry-50: #ffe2d6;
--color-buchel-cherry-100: #ffd2c4;
--color-buchel-cherry-200: #ffb6a5;
--color-buchel-cherry-300: #ff917e;
--color-buchel-cherry-400: #f86c5e;
--color-buchel-cherry-500: #e64339;
--color-buchel-cherry-600: #c33b31;
--color-buchel-cherry-700: #9d2f27;
--color-buchel-cherry-800: #75201d;
--color-buchel-cherry-900: #531513;
--color-buchel-cherry-950: #370505;
}SCSS
$buchel-cherry: #aa1111;
$buchel-cherry-rgb: 170, 17, 17;
$buchel-cherry-light: mix(#fff, $buchel-cherry, 20%);
$buchel-cherry-dark: mix(#000, $buchel-cherry, 20%);
.element {
color: $buchel-cherry;
box-shadow: 0 0 0 2px rgba($buchel-cherry, 0.35);
}