命名颜色 · #B3833F
Honeysuckle Blast
Honeysuckle Blast 即 #B3833F：rgb(179 131 63)、hsl(35 48% 47%)、oklch(0.644 0.103 73.6)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Orange mean? → · Honeysuckle Blast color name →
#B3833F
oklch(0.644 0.103 73.6)
颜色转换
- HEX
- #b3833f
- RGB
- rgb(179 131 63)
- HSL
- hsl(35 48% 47%)
- HWB
- hwb(35 25% 30%)
- OKLCH
- oklch(0.644 0.103 73.6)
- OKLab
- oklab(0.644 0.029 0.099)
- CIE Lab
- lab(58.6 13.84 43.42)
- LCH
- lch(58.6 45.57 72.3)
- CMYK
- cmyk(0% 27% 65% 30%)
浅色调 · 深色调 · 灰色调
浅色调
- BB8F54
- C39B68
- CAA87B
- D2B48E
- DAC0A0
- E1CDB3
- E9D9C6
- F0E6D9
- F8F2EC
深色调
- 9B7135
- 84602C
- 6E4F23
- 583F1B
- 432F12
- 2F200A
- 1D1204
- 0C0601
- 010100
灰色调
- AE8348
- A98350
- A48357
- 9F835E
- 9A8264
- 95826A
- 908270
- 8B8175
- 85817B
配色和谐
互补色 +180°
- B3833F
Honeysuckle Blast
- 5F90CB
≈ Provence
类似色 -30° +30°
- B3833F
Honeysuckle Blast
- C27858
≈ Moroccan Sky
- 98903F
≈ Delta Break
三角配色 +120° +240°
- B3833F
Honeysuckle Blast
- 21A19F
≈ Silken Jade
- A47ABA
≈ Wisteria
分裂互补色 +150° +210°
- B3833F
Honeysuckle Blast
- 349BBB
≈ Sailfish
- 8584CA
≈ Faraway Sky
四角配色 +90° +180° +270°
- B3833F
Honeysuckle Blast
- 48A17C
≈ Funk
- 5F90CB
≈ Provence
- B9739D
≈ Valentine Heart
对比度与无障碍
Ag
Fail白底
WCAG 3.36:1 · APCA Lc 61
Ag
AA黑底
WCAG 6.23:1 · APCA Lc 41
最佳文字颜色: #000000
WCAG 6.23:1 (AA) · APCA Lc 41
Contrast pairs
代码片段
CSS
:root {
--honeysuckle-blast: #b3833f;
--honeysuckle-blast-rgb: 179 131 63;
--honeysuckle-blast-oklch: oklch(0.644 0.103 73.6);
}
.element {
color: var(--honeysuckle-blast);
background-color: hsl(35 48% 47%);
border-color: oklch(0.644 0.103 73.6);
}Tailwind CSS v4
@theme {
--color-honeysuckle-blast: #b3833f;
--color-honeysuckle-blast-50: #fff2d5;
--color-honeysuckle-blast-100: #fde4c2;
--color-honeysuckle-blast-200: #eecfa3;
--color-honeysuckle-blast-300: #d6b07b;
--color-honeysuckle-blast-400: #c39556;
--color-honeysuckle-blast-500: #af7a2b;
--color-honeysuckle-blast-600: #946826;
--color-honeysuckle-blast-700: #77531e;
--color-honeysuckle-blast-800: #583c14;
--color-honeysuckle-blast-900: #3e290d;
--color-honeysuckle-blast-950: #271702;
}SCSS
$honeysuckle-blast: #b3833f;
$honeysuckle-blast-rgb: 179, 131, 63;
$honeysuckle-blast-light: mix(#fff, $honeysuckle-blast, 20%);
$honeysuckle-blast-dark: mix(#000, $honeysuckle-blast, 20%);
.element {
color: $honeysuckle-blast;
box-shadow: 0 0 0 2px rgba($honeysuckle-blast, 0.35);
}