命名颜色 · #6F0C0D
Coffee Brick
Coffee Brick 即 #6F0C0D：rgb(111 12 13)、hsl(359 80% 24%)、oklch(0.348 0.131 27.2)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Red mean? → · Coffee Brick color name →
#6F0C0D
oklch(0.348 0.131 27.2)
颜色转换
- HEX
- #6f0c0d
- RGB
- rgb(111 12 13)
- HSL
- hsl(359 80% 24%)
- HWB
- hwb(359 5% 56%)
- OKLCH
- oklch(0.348 0.131 27.2)
- OKLab
- oklab(0.348 0.117 0.06)
- CIE Lab
- lab(23.08 41.41 29.52)
- LCH
- lch(23.08 50.85 35.5)
- CMYK
- cmyk(0% 89% 88% 56%)
浅色调 · 深色调 · 灰色调
浅色调
- 7F2B25
- 8F433B
- 9E5A52
- AD7069
- BC8781
- CA9F99
- D8B6B1
- E5CECB
- F2E6E5
深色调
- 60090A
- 510607
- 420405
- 340303
- 270202
- 1A0101
- 0E0000
- 040000
- 010000
灰色调
- 731E1A
- 762C26
- 793831
- 7B433D
- 7D4D48
- 7E5853
- 80625E
- 806C69
- 807674
配色和谐
互补色 +180°
- 6F0C0D
Coffee Brick
- 00434A
≈ Dark Side
类似色 -30° +30°
- 6F0C0D
Coffee Brick
- 6A0B3B
≈ Spanish Purple
- 5A2C00
≈ Count Chocula
三角配色 +120° +240°
- 6F0C0D
Coffee Brick
- 004716
≈ Borg Drone
- 1C317D
≈ Bavarian Blue
分裂互补色 +150° +210°
- 6F0C0D
Coffee Brick
- 00453A
≈ MSU Green
- 003F5D
≈ Maniac Mansion
四角配色 +90° +180° +270°
- 6F0C0D
Coffee Brick
- 373F00
≈ Dark Olive
- 00434A
≈ Dark Side
- 432474
≈ Clear Purple
对比度与无障碍
Ag
AAA白底
WCAG 12.10:1 · APCA Lc 96
Ag
Fail黑底
WCAG 1.73:1 · APCA Lc 0
最佳文字颜色: #FFFFFF
WCAG 12.10:1 (AAA) · APCA Lc 96
Contrast pairs
代码片段
CSS
:root {
--coffee-brick: #6f0c0d;
--coffee-brick-rgb: 111 12 13;
--coffee-brick-oklch: oklch(0.348 0.131 27.2);
}
.element {
color: var(--coffee-brick);
background-color: hsl(359 80% 24%);
border-color: oklch(0.348 0.131 27.2);
}Tailwind CSS v4
@theme {
--color-coffee-brick: #6f0c0d;
--color-coffee-brick-50: #ffe8e0;
--color-coffee-brick-100: #ffd8cf;
--color-coffee-brick-200: #ffc0b4;
--color-coffee-brick-300: #f39d90;
--color-coffee-brick-400: #e17e73;
--color-coffee-brick-500: #cf5e54;
--color-coffee-brick-600: #af5148;
--color-coffee-brick-700: #8c4039;
--color-coffee-brick-800: #692e2a;
--color-coffee-brick-900: #4a1f1c;
--color-coffee-brick-950: #300e0d;
}SCSS
$coffee-brick: #6f0c0d;
$coffee-brick-rgb: 111, 12, 13;
$coffee-brick-light: mix(#fff, $coffee-brick, 20%);
$coffee-brick-dark: mix(#000, $coffee-brick, 20%);
.element {
color: $coffee-brick;
box-shadow: 0 0 0 2px rgba($coffee-brick, 0.35);
}