最接近的命名颜色 · #DE1E8A
#DE1E8A
最接近的命名颜色: Benevolent Pink
#DE1E8A（rgb(222 30 138)、hsl(326 76% 49%)、oklch(0.599 0.233 353.7)）最接近命名颜色 Benevolent Pink。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
#DE1E8A
oklch(0.599 0.233 353.7)
颜色转换
- HEX
- #de1e8a
- RGB
- rgb(222 30 138)
- HSL
- hsl(326 76% 49%)
- HWB
- hwb(326 12% 13%)
- OKLCH
- oklch(0.599 0.233 353.7)
- OKLab
- oklab(0.599 0.232 -0.026)
- CIE Lab
- lab(50.36 73.95 -8.79)
- LCH
- lch(50.36 74.47 353.2)
- CMYK
- cmyk(0% 86% 38% 13%)
浅色调 · 深色调 · 灰色调
浅色调
- E54395
- EB5DA0
- F074AC
- F489B7
- F89EC3
- FBB1CF
- FDC5DB
- FFD8E7
- FFECF3
深色调
- C11977
- A51365
- 890E53
- 6F0942
- 550532
- 3D0322
- 260114
- 120007
- 020001
灰色调
- D63489
- CE4388
- C64E87
- BD5886
- B56085
- AB6884
- A26F83
- 977582
- 8C7B81
配色和谐
互补色 +180°
- DE1E8A
Benevolent Pink
- 00957A
≈ Pool Table
类似色 -30° +30°
- DE1E8A
Benevolent Pink
- BE3ACC
≈ Ultraviolet Berl
- EB1833
≈ Transfusion
三角配色 +120° +240°
- DE1E8A
Benevolent Pink
- 808800
≈ Krypton Green
- 008BBE
≈ Hawaiian Surf
分裂互补色 +150° +210°
- DE1E8A
Benevolent Pink
- 009B1A
≈ Green Gardens
- 00919B
≈ Peacock Feather
四角配色 +90° +180° +270°
- DE1E8A
Benevolent Pink
- A27800
≈ Nataneyu Gold
- 00957A
≈ Pool Table
- 3773FF
≈ Hailey Blue
对比度与无障碍
Ag
AA白底
WCAG 4.50:1 · APCA Lc 69
Ag
AA黑底
WCAG 4.65:1 · APCA Lc 32
最佳文字颜色: #000000
WCAG 4.65:1 (AA) · APCA Lc 32
Contrast pairs
代码片段
CSS
:root {
--benevolent-pink: #de1e8a;
--benevolent-pink-rgb: 222 30 138;
--benevolent-pink-oklch: oklch(0.599 0.233 353.7);
}
.element {
color: var(--benevolent-pink);
background-color: hsl(326 76% 49%);
border-color: oklch(0.599 0.233 353.7);
}Tailwind CSS v4
@theme {
--color-benevolent-pink: #de1e8a;
--color-benevolent-pink-50: #ffdaf8;
--color-benevolent-pink-100: #ffc7eb;
--color-benevolent-pink-200: #ffa8d8;
--color-benevolent-pink-300: #ff7ebc;
--color-benevolent-pink-400: #ff52a9;
--color-benevolent-pink-500: #ee0091;
--color-benevolent-pink-600: #c90e7b;
--color-benevolent-pink-700: #a10e62;
--color-benevolent-pink-800: #78084b;
--color-benevolent-pink-900: #550634;
--color-benevolent-pink-950: #380020;
}SCSS
$benevolent-pink: #de1e8a;
$benevolent-pink-rgb: 222, 30, 138;
$benevolent-pink-light: mix(#fff, $benevolent-pink, 20%);
$benevolent-pink-dark: mix(#000, $benevolent-pink, 20%);
.element {
color: $benevolent-pink;
box-shadow: 0 0 0 2px rgba($benevolent-pink, 0.35);
}