最接近的命名颜色 · #3D1225
#3D1225
最接近的命名颜色: Chocolate Kiss
#3D1225(rgb(61 18 37)、hsl(333 54% 15%)、oklch(0.259 0.071 355.8))最接近命名颜色 Chocolate Kiss。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度,以及 CSS、Tailwind v4 和 SCSS 代码。
#3D1225
oklch(0.259 0.071 355.8)
颜色转换
- HEX
- #3d1225
- RGB
- rgb(61 18 37)
- HSL
- hsl(333 54% 15%)
- HWB
- hwb(333 7% 76%)
- OKLCH
- oklch(0.259 0.071 355.8)
- OKLab
- oklab(0.259 0.071 -0.005)
- CIE Lab
- lab(13.13 23.05 -1.71)
- LCH
- lch(13.13 23.11 355.8)
- CMYK
- cmyk(0% 70% 39% 76%)
浅色调 · 深色调 · 灰色调
浅色调
- 502737
- 623C4B
- 75525F
- 886974
- 9C808A
- AF99A0
- C3B1B7
- D7CBCE
- EBE5E7
深色调
- 340E1F
- 2B0A19
- 220713
- 1A040D
- 120208
- 0A0104
- 040102
- 010000
- 000000
灰色调
- 441D2D
- 4C2836
- 53323E
- 593D47
- 604850
- 675359
- 6D5E63
- 74696C
- 7A7476
配色和谐
互补色 +180°
- 3D1225
Chocolate Kiss
- 002B23
≈ Deep Slate Green
类似色 -30° +30°
- 3D1225
Chocolate Kiss
- 351536
≈ Cultist Robe
- 401311
≈ English Breakfast
三角配色 +120° +240°
- 3D1225
Chocolate Kiss
- 232700
≈ Liquorice Root
- 00273B
≈ Murky Depths
分裂互补色 +150° +210°
- 3D1225
Chocolate Kiss
- 062C0C
≈ Haunted Forest
- 002A2E
≈ Daintree
四角配色 +90° +180° +270°
- 3D1225
Chocolate Kiss
- 2F2100
≈ Black Swan
- 002B23
≈ Deep Slate Green
- 132146
≈ Dark Eclipse
对比度与无障碍
Ag
AAA白底
WCAG 16.01:1 · APCA Lc 103
Ag
Fail黑底
WCAG 1.31:1 · APCA Lc 0
最佳文字颜色: #FFFFFF
WCAG 16.01:1 (AAA) · APCA Lc 103
Contrast pairs
代码片段
CSS
:root {
--chocolate-kiss: #3d1225;
--chocolate-kiss-rgb: 61 18 37;
--chocolate-kiss-oklch: oklch(0.259 0.071 355.8);
}
.element {
color: var(--chocolate-kiss);
background-color: hsl(333 54% 15%);
border-color: oklch(0.259 0.071 355.8);
}Tailwind CSS v4
@theme {
--color-chocolate-kiss: #3d1225;
--color-chocolate-kiss-50: #ffedf5;
--color-chocolate-kiss-100: #fddfe8;
--color-chocolate-kiss-200: #efc8d4;
--color-chocolate-kiss-300: #d7a9b7;
--color-chocolate-kiss-400: #c18da0;
--color-chocolate-kiss-500: #ac7288;
--color-chocolate-kiss-600: #926173;
--color-chocolate-kiss-700: #754d5c;
--color-chocolate-kiss-800: #563844;
--color-chocolate-kiss-900: #3c262f;
--color-chocolate-kiss-950: #26151c;
}SCSS
$chocolate-kiss: #3d1225;
$chocolate-kiss-rgb: 61, 18, 37;
$chocolate-kiss-light: mix(#fff, $chocolate-kiss, 20%);
$chocolate-kiss-dark: mix(#000, $chocolate-kiss, 20%);
.element {
color: $chocolate-kiss;
box-shadow: 0 0 0 2px rgba($chocolate-kiss, 0.35);
}