最接近的命名颜色 · #D65C61
#D65C61
最接近的命名颜色: Happy Hearts
#D65C61（rgb(214 92 97)、hsl(358 60% 60%)、oklch(0.63 0.154 20.1)）最接近命名颜色 Happy Hearts。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
#D65C61
oklch(0.63 0.154 20.1)
颜色转换
- HEX
- #d65c61
- RGB
- rgb(214 92 97)
- HSL
- hsl(358 60% 60%)
- HWB
- hwb(358 36% 16%)
- OKLCH
- oklch(0.63 0.154 20.1)
- OKLab
- oklab(0.63 0.145 0.053)
- CIE Lab
- lab(55.44 49.26 22.54)
- LCH
- lch(55.44 54.17 24.6)
- CMYK
- cmyk(0% 57% 55% 16%)
浅色调 · 深色调 · 灰色调
浅色调
- DC6E70
- E27E7F
- E78F8F
- EC9F9E
- F0AFAE
- F4BFBE
- F8CFCE
- FBDFDE
- FDEFEE
深色调
- BA4F53
- 9E4246
- 843639
- 6A2A2D
- 521F21
- 3B1415
- 250A0B
- 100303
- 020000
灰色调
- CE6164
- C76668
- BF6A6B
- B76E6E
- AE7271
- A67574
- 9D7877
- 947B7A
- 8A7E7D
配色和谐
互补色 +180°
- D65C61
Happy Hearts
- 009CA3
≈ Island Dream
类似色 -30° +30°
- D65C61
Happy Hearts
- CB5C96
≈ Phlox Pink
- D0681E
≈ Hot Cinnamon
三角配色 +120° +240°
- D65C61
Happy Hearts
- 509F3E
≈ Oregano Green
- 4F87E5
≈ Blue Jay
分裂互补色 +150° +210°
- D65C61
Happy Hearts
- 00A17E
≈ Sport Green
- 0096C6
≈ UV Light
四角配色 +90° +180° +270°
- D65C61
Happy Hearts
- 8F8F00
≈ Old Asparagus
- 009CA3
≈ Island Dream
- 8A75DE
≈ Matt Purple
对比度与无障碍
Ag
Fail白底
WCAG 3.77:1 · APCA Lc 65
Ag
AA黑底
WCAG 5.56:1 · APCA Lc 37
最佳文字颜色: #000000
WCAG 5.56:1 (AA) · APCA Lc 37
Contrast pairs
代码片段
CSS
:root {
--happy-hearts: #d65c61;
--happy-hearts-rgb: 214 92 97;
--happy-hearts-oklch: oklch(0.63 0.154 20.1);
}
.element {
color: var(--happy-hearts);
background-color: hsl(358 60% 60%);
border-color: oklch(0.63 0.154 20.1);
}Tailwind CSS v4
@theme {
--color-happy-hearts: #d65c61;
--color-happy-hearts-50: #ffe5e1;
--color-happy-hearts-100: #ffd4d1;
--color-happy-hearts-200: #ffbab6;
--color-happy-hearts-300: #fc9693;
--color-happy-hearts-400: #eb7578;
--color-happy-hearts-500: #d9525a;
--color-happy-hearts-600: #b7464d;
--color-happy-hearts-700: #93383d;
--color-happy-hearts-800: #6e272d;
--color-happy-hearts-900: #4d1a1f;
--color-happy-hearts-950: #330a0f;
}SCSS
$happy-hearts: #d65c61;
$happy-hearts-rgb: 214, 92, 97;
$happy-hearts-light: mix(#fff, $happy-hearts, 20%);
$happy-hearts-dark: mix(#000, $happy-hearts, 20%);
.element {
color: $happy-hearts;
box-shadow: 0 0 0 2px rgba($happy-hearts, 0.35);
}