命名颜色 · #C19A6C
Cardboard
Cardboard 即 #C19A6C：rgb(193 154 108)、hsl(32 41% 59%)、oklch(0.711 0.077 70.7)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Orange mean? → · Cardboard color name →
#C19A6C
oklch(0.711 0.077 70.7)
颜色转换
- HEX
- #c19a6c
- RGB
- rgb(193 154 108)
- HSL
- hsl(32 41% 59%)
- HWB
- hwb(32 42% 24%)
- OKLCH
- oklch(0.711 0.077 70.7)
- OKLab
- oklab(0.711 0.026 0.073)
- CIE Lab
- lab(66.47 10.59 29.94)
- LCH
- lch(66.47 31.76 70.5)
- CMYK
- cmyk(0% 20% 44% 24%)
浅色调 · 深色调 · 灰色调
浅色调
- C7A47B
- CEAE89
- D4B898
- DAC2A6
- E0CCB5
- E6D6C4
- EDE0D2
- F3EAE1
- F9F5F0
深色调
- A7855D
- 8F714E
- 775E40
- 5F4B32
- 493925
- 342719
- 20170D
- 0E0904
- 020100
灰色调
- BA986F
- B49571
- AD9273
- A79076
- A08D78
- 9A8B7A
- 93887B
- 8D857D
- 86837F
配色和谐
互补色 +180°
- C19A6C
Cardboard
- 7EA6D1
≈ Paula Loves Paris
类似色 -30° +30°
- C19A6C
Cardboard
- CC927D
≈ Simmering Ridge
- ACA46A
≈ Wavy Glass
三角配色 +120° +240°
- C19A6C
Cardboard
- 64B2AD
≈ Artesian Well
- B195C6
≈ Quibble
分裂互补色 +150° +210°
- C19A6C
Cardboard
- 68ADC4
≈ Blue Mist
- 999DD2
≈ Bluebell Frost
四角配色 +90° +180° +270°
对比度与无障碍
Ag
Fail白底
WCAG 2.59:1 · APCA Lc 51
Ag
AAA黑底
WCAG 8.10:1 · APCA Lc 51
最佳文字颜色: #000000
WCAG 8.10:1 (AAA) · APCA Lc 51
Contrast pairs
代码片段
CSS
:root {
--cardboard: #c19a6c;
--cardboard-rgb: 193 154 108;
--cardboard-oklch: oklch(0.711 0.077 70.7);
}
.element {
color: var(--cardboard);
background-color: hsl(32 41% 59%);
border-color: oklch(0.711 0.077 70.7);
}Tailwind CSS v4
@theme {
--color-cardboard: #c19a6c;
--color-cardboard-50: #fff2de;
--color-cardboard-100: #f8e4cc;
--color-cardboard-200: #e9d0b1;
--color-cardboard-300: #d0b28c;
--color-cardboard-400: #bc976c;
--color-cardboard-500: #a77d4b;
--color-cardboard-600: #8d6a40;
--color-cardboard-700: #715533;
--color-cardboard-800: #543d24;
--color-cardboard-900: #3b2a18;
--color-cardboard-950: #251809;
}SCSS
$cardboard: #c19a6c;
$cardboard-rgb: 193, 154, 108;
$cardboard-light: mix(#fff, $cardboard, 20%);
$cardboard-dark: mix(#000, $cardboard, 20%);
.element {
color: $cardboard;
box-shadow: 0 0 0 2px rgba($cardboard, 0.35);
}