最接近的命名颜色 · #D8356D
#D8356D
最接近的命名颜色: Watermelon Sugar
#D8356D（rgb(216 53 109)、hsl(339 68% 53%)、oklch(0.593 0.201 5.5)）最接近命名颜色 Watermelon Sugar。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
#D8356D
oklch(0.593 0.201 5.5)
颜色转换
- HEX
- #d8356d
- RGB
- rgb(216 53 109)
- HSL
- hsl(339 68% 53%)
- HWB
- hwb(339 21% 15%)
- OKLCH
- oklch(0.593 0.201 5.5)
- OKLab
- oklab(0.593 0.2 0.019)
- CIE Lab
- lab(50.4 65.29 8.66)
- LCH
- lch(50.4 65.86 7.6)
- CMYK
- cmyk(0% 75% 50% 15%)
浅色调 · 深色调 · 灰色调
浅色调
- DF507B
- E56688
- EB7B96
- F08EA5
- F4A1B3
- F8B4C2
- FBC7D1
- FDDAE0
- FEECEF
深色调
- BC2D5E
- A0254F
- 851D41
- 6B1533
- 530E26
- 3B0819
- 25030D
- 110104
- 020001
灰色调
- D1426F
- C94D71
- C25673
- BA5D75
- B16477
- A86B78
- 9F717A
- 96767C
- 8B7B7E
配色和谐
互补色 +180°
- D8356D
Watermelon Sugar
- 009287
≈ Deep Peacock Blue
类似色 -30° +30°
- D8356D
Watermelon Sugar
- C241AC
≈ Ultraviolet Nusp
- DB3E0B
≈ Torii Red
三角配色 +120° +240°
- D8356D
Watermelon Sugar
- 698D00
≈ Asparagus Sultan
- 0084D1
≈ Calgar Blue
分裂互补色 +150° +210°
- D8356D
Watermelon Sugar
- 009757
≈ Garnish
- 008DA6
≈ Quintana
四角配色 +90° +180° +270°
- D8356D
Watermelon Sugar
- 957D00
≈ Moscow Papyrus
- 009287
≈ Deep Peacock Blue
- 616BF3
≈ Blue Hepatica
对比度与无障碍
Ag
AA白底
WCAG 4.51:1 · APCA Lc 70
Ag
AA黑底
WCAG 4.64:1 · APCA Lc 32
最佳文字颜色: #000000
WCAG 4.64:1 (AA) · APCA Lc 32
Contrast pairs
代码片段
CSS
:root {
--watermelon-sugar: #d8356d;
--watermelon-sugar-rgb: 216 53 109;
--watermelon-sugar-oklch: oklch(0.593 0.201 5.5);
}
.element {
color: var(--watermelon-sugar);
background-color: hsl(339 68% 53%);
border-color: oklch(0.593 0.201 5.5);
}Tailwind CSS v4
@theme {
--color-watermelon-sugar: #d8356d;
--color-watermelon-sugar-50: #ffdeeb;
--color-watermelon-sugar-100: #ffccdc;
--color-watermelon-sugar-200: #ffafc5;
--color-watermelon-sugar-300: #ff87a5;
--color-watermelon-sugar-400: #fb608d;
--color-watermelon-sugar-500: #e93073;
--color-watermelon-sugar-600: #c52b61;
--color-watermelon-sugar-700: #9e234e;
--color-watermelon-sugar-800: #76173b;
--color-watermelon-sugar-900: #530f28;
--color-watermelon-sugar-950: #370116;
}SCSS
$watermelon-sugar: #d8356d;
$watermelon-sugar-rgb: 216, 53, 109;
$watermelon-sugar-light: mix(#fff, $watermelon-sugar, 20%);
$watermelon-sugar-dark: mix(#000, $watermelon-sugar, 20%);
.element {
color: $watermelon-sugar;
box-shadow: 0 0 0 2px rgba($watermelon-sugar, 0.35);
}