命名颜色 · #DEBBBF
Crystalline Pink
Crystalline Pink 即 #DEBBBF：rgb(222 187 191)、hsl(353 35% 80%)、oklch(0.823 0.04 10.2)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Pink mean? → · Crystalline Pink color name →
#DEBBBF
oklch(0.823 0.04 10.2)
颜色转换
- HEX
- #debbbf
- RGB
- rgb(222 187 191)
- HSL
- hsl(353 35% 80%)
- HWB
- hwb(353 73% 13%)
- OKLCH
- oklch(0.823 0.04 10.2)
- OKLab
- oklab(0.823 0.04 0.007)
- CIE Lab
- lab(79.06 13.39 2.89)
- LCH
- lch(79.06 13.7 12.2)
- CMYK
- cmyk(0% 16% 14% 13%)
浅色调 · 深色调 · 灰色调
浅色调
- E1C2C5
- E5C8CC
- E8CFD2
- ECD6D8
- EFDDDF
- F2E3E5
- F5EAEB
- F9F1F2
- FCF8F8
深色调
- C1A2A6
- A58A8D
- 897375
- 6F5C5E
- 554648
- 3D3233
- 261F1F
- 120D0D
- 020202
灰色调
- D4B5B9
- CBAFB2
- C1A9AC
- B8A3A5
- AE9D9F
- A59799
- 9C9192
- 928C8C
- 898686
配色和谐
互补色 +180°
- DEBBBF
Crystalline Pink
- A8CECB
≈ Blue Angora
类似色 -30° +30°
- DEBBBF
Crystalline Pink
- D8BCCD
≈ Noteworthy
- DDBDB2
≈ Peach Blush
三角配色 +120° +240°
- DEBBBF
Crystalline Pink
- BCCBB0
≈ Succulent Garden
- B2C8DF
≈ Wind Blue
分裂互补色 +150° +210°
- DEBBBF
Crystalline Pink
- B0CEBC
≈ Gossamer Green
- A9CCD8
≈ Easy Breezy
四角配色 +90° +180° +270°
- DEBBBF
Crystalline Pink
- CBC6A9
≈ Wild Hillside
- A8CECB
≈ Blue Angora
- C0C3E0
≈ Genevieve
对比度与无障碍
Ag
Fail白底
WCAG 1.75:1 · APCA Lc 32
Ag
AAA黑底
WCAG 11.96:1 · APCA Lc 71
最佳文字颜色: #000000
WCAG 11.96:1 (AAA) · APCA Lc 71
Contrast pairs
代码片段
CSS
:root {
--crystalline-pink: #debbbf;
--crystalline-pink-rgb: 222 187 191;
--crystalline-pink-oklch: oklch(0.823 0.04 10.2);
}
.element {
color: var(--crystalline-pink);
background-color: hsl(353 35% 80%);
border-color: oklch(0.823 0.04 10.2);
}Tailwind CSS v4
@theme {
--color-crystalline-pink: #debbbf;
--color-crystalline-pink-50: #fff1f2;
--color-crystalline-pink-100: #f5e3e4;
--color-crystalline-pink-200: #e5cecf;
--color-crystalline-pink-300: #cbafb2;
--color-crystalline-pink-400: #b59599;
--color-crystalline-pink-500: #9f7b80;
--color-crystalline-pink-600: #86696c;
--color-crystalline-pink-700: #6c5456;
--color-crystalline-pink-800: #4f3d40;
--color-crystalline-pink-900: #372a2c;
--color-crystalline-pink-950: #221719;
}SCSS
$crystalline-pink: #debbbf;
$crystalline-pink-rgb: 222, 187, 191;
$crystalline-pink-light: mix(#fff, $crystalline-pink, 20%);
$crystalline-pink-dark: mix(#000, $crystalline-pink, 20%);
.element {
color: $crystalline-pink;
box-shadow: 0 0 0 2px rgba($crystalline-pink, 0.35);
}