命名颜色 · #AA8880
Bedford Brown
Bedford Brown 即 #AA8880：rgb(170 136 128)、hsl(11 20% 58%)、oklch(0.656 0.043 33.5)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Red mean? → · Bedford Brown color name →
#AA8880
oklch(0.656 0.043 33.5)
颜色转换
- HEX
- #aa8880
- RGB
- rgb(170 136 128)
- HSL
- hsl(11 20% 58%)
- HWB
- hwb(11 50% 33%)
- OKLCH
- oklch(0.656 0.043 33.5)
- OKLab
- oklab(0.656 0.036 0.024)
- CIE Lab
- lab(59.8 12.45 9.49)
- LCH
- lch(59.8 15.65 37.3)
- CMYK
- cmyk(0% 20% 25% 33%)
浅色调 · 深色调 · 灰色调
浅色调
- B2938C
- BB9F98
- C3AAA5
- CCB6B1
- D4C2BE
- DDCECA
- E5DAD7
- EEE6E4
- F6F3F2
深色调
- 93756E
- 7D635D
- 68524D
- 53413D
- 3F312E
- 2D221F
- 1B1312
- 0B0606
- 010101
灰色调
- A68780
- A28780
- 9E8680
- 998580
- 958480
- 918380
- 8D8380
- 898280
- 848180
配色和谐
互补色 +180°
- AA8880
Bedford Brown
- 7398A1
≈ Cameo Blue
类似色 -30° +30°
- AA8880
Bedford Brown
- A9868E
≈ Fig Fruit Mauve
- A58C76
≈ Natural
三角配色 +120° +240°
- AA8880
Bedford Brown
- 7D9985
≈ Parisian Patina
- 8890AC
≈ Papilio Argeotus
分裂互补色 +150° +210°
- AA8880
Bedford Brown
- 749A94
≈ Avalon
- 7B95AA
≈ Nordland Blue
四角配色 +90° +180° +270°
- AA8880
Bedford Brown
- 8C9679
≈ Leafy Rise
- 7398A1
≈ Cameo Blue
- 968BA7
≈ Smoky Mauve
对比度与无障碍
Ag
Fail白底
WCAG 3.20:1 · APCA Lc 59
Ag
AA黑底
WCAG 6.54:1 · APCA Lc 42
最佳文字颜色: #000000
WCAG 6.54:1 (AA) · APCA Lc 42
Contrast pairs
代码片段
CSS
:root {
--bedford-brown: #aa8880;
--bedford-brown-rgb: 170 136 128;
--bedford-brown-oklch: oklch(0.656 0.043 33.5);
}
.element {
color: var(--bedford-brown);
background-color: hsl(11 20% 58%);
border-color: oklch(0.656 0.043 33.5);
}Tailwind CSS v4
@theme {
--color-bedford-brown: #aa8880;
--color-bedford-brown-50: #fff1ed;
--color-bedford-brown-100: #f6e3de;
--color-bedford-brown-200: #e6cec8;
--color-bedford-brown-300: #ccb0a8;
--color-bedford-brown-400: #b7968e;
--color-bedford-brown-500: #a17c74;
--color-bedford-brown-600: #886962;
--color-bedford-brown-700: #6d544e;
--color-bedford-brown-800: #503d39;
--color-bedford-brown-900: #382a27;
--color-bedford-brown-950: #231715;
}SCSS
$bedford-brown: #aa8880;
$bedford-brown-rgb: 170, 136, 128;
$bedford-brown-light: mix(#fff, $bedford-brown, 20%);
$bedford-brown-dark: mix(#000, $bedford-brown, 20%);
.element {
color: $bedford-brown;
box-shadow: 0 0 0 2px rgba($bedford-brown, 0.35);
}