命名颜色 · #BB6528
Ruddy Brown
Ruddy Brown 即 #BB6528：rgb(187 101 40)、hsl(25 65% 45%)、oklch(0.596 0.132 52.1)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Orange mean? → · Ruddy Brown color name →
#BB6528
oklch(0.596 0.132 52.1)
颜色转换
- HEX
- #bb6528
- RGB
- rgb(187 101 40)
- HSL
- hsl(25 65% 45%)
- HWB
- hwb(25 16% 27%)
- OKLCH
- oklch(0.596 0.132 52.1)
- OKLab
- oklab(0.596 0.081 0.104)
- CIE Lab
- lab(52.41 32.16 48.4)
- LCH
- lch(52.41 58.11 56.4)
- CMYK
- cmyk(0% 46% 79% 27%)
浅色调 · 深色调 · 灰色调
浅色调
- C37542
- CB8458
- D2936D
- D9A382
- E0B296
- E7C1AB
- EDD1C0
- F3E0D5
- F9EFEA
深色调
- A25721
- 8A491B
- 733C15
- 5C2F0F
- 462209
- 321704
- 1F0C02
- 0D0301
- 020000
灰色调
- B66935
- B06C40
- AB6F4A
- A57253
- A0755B
- 9A7763
- 947A6A
- 8D7C72
- 877E79
配色和谐
互补色 +180°
- BB6528
Ruddy Brown
- 008ABB
≈ Mermaid Dreams
类似色 -30° +30°
- BB6528
Ruddy Brown
- C15B5A
≈ Pimm’s
- A37600
≈ Nataneyu Gold
三角配色 +120° +240°
- BB6528
Ruddy Brown
- 009577
≈ Pool Table
- 826EC6
≈ Venus Violet
分裂互补色 +150° +210°
- BB6528
Ruddy Brown
- 009099
≈ Splashy
- 527DCD
≈ Serenity’s Reign
四角配色 +90° +180° +270°
- BB6528
Ruddy Brown
- 4C9245
≈ May Green
- 008ABB
≈ Mermaid Dreams
- A362AD
≈ Prickly Purple
对比度与无障碍
Ag
Fail白底
WCAG 4.19:1 · APCA Lc 68
Ag
AA黑底
WCAG 5.00:1 · APCA Lc 33
最佳文字颜色: #000000
WCAG 5.00:1 (AA) · APCA Lc 33
Contrast pairs
代码片段
CSS
:root {
--ruddy-brown: #bb6528;
--ruddy-brown-rgb: 187 101 40;
--ruddy-brown-oklch: oklch(0.596 0.132 52.1);
}
.element {
color: var(--ruddy-brown);
background-color: hsl(25 65% 45%);
border-color: oklch(0.596 0.132 52.1);
}Tailwind CSS v4
@theme {
--color-ruddy-brown: #bb6528;
--color-ruddy-brown-50: #ffecd2;
--color-ruddy-brown-100: #ffddbf;
--color-ruddy-brown-200: #ffc69f;
--color-ruddy-brown-300: #eca575;
--color-ruddy-brown-400: #db8650;
--color-ruddy-brown-500: #c86921;
--color-ruddy-brown-600: #a9591f;
--color-ruddy-brown-700: #884718;
--color-ruddy-brown-800: #663311;
--color-ruddy-brown-900: #47220b;
--color-ruddy-brown-950: #2e1101;
}SCSS
$ruddy-brown: #bb6528;
$ruddy-brown-rgb: 187, 101, 40;
$ruddy-brown-light: mix(#fff, $ruddy-brown, 20%);
$ruddy-brown-dark: mix(#000, $ruddy-brown, 20%);
.element {
color: $ruddy-brown;
box-shadow: 0 0 0 2px rgba($ruddy-brown, 0.35);
}