命名颜色 · #FED5E9
Pink Currant
Pink Currant 即 #FED5E9：rgb(254 213 233)、hsl(331 95% 92%)、oklch(0.913 0.052 347.2)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Pink mean? → · Pink Currant color name →
#FED5E9
oklch(0.913 0.052 347.2)
颜色转换
- HEX
- #fed5e9
- RGB
- rgb(254 213 233)
- HSL
- hsl(331 95% 92%)
- HWB
- hwb(331 84% 0%)
- OKLCH
- oklch(0.913 0.052 347.2)
- OKLab
- oklab(0.913 0.051 -0.012)
- CIE Lab
- lab(89.25 17.15 -4.22)
- LCH
- lch(89.25 17.66 346.2)
- CMYK
- cmyk(0% 16% 8% 0%)
浅色调 · 深色调 · 灰色调
浅色调
- FED9EB
- FFDDED
- FFE2F0
- FFE6F2
- FFEAF4
- FFEEF6
- FFF2F8
- FFF7FB
- FFFBFD
深色调
- DDB9CB
- BD9EAD
- 9E8390
- 806A74
- 63515A
- 473A41
- 2D2429
- 161013
- 030203
灰色调
- F1CCDE
- E4C3D3
- D7BBC8
- CAB2BE
- BDAAB3
- B1A1A9
- A4999E
- 989094
- 8C888A
配色和谐
互补色 +180°
- FED5E9
Pink Currant
- C2EEDB
≈ Seafoam Pearl
类似色 -30° +30°
- FED5E9
Pink Currant
- F1D8FA
≈ Lavender Savour
- FFD7D8
≈ We Peep
三角配色 +120° +240°
- FED5E9
Pink Currant
- E6E6BE
≈ Lily Scent Green
- BFEAFE
≈ Blue Java Banana
分裂互补色 +150° +210°
- FED5E9
Pink Currant
- D2EBC9
≈ Mint Frappé
- BAEEEE
≈ Cold Blooded
四角配色 +90° +180° +270°
- FED5E9
Pink Currant
- F6DFBC
≈ Ginger Ale Fizz
- C2EEDB
≈ Seafoam Pearl
- D1E4FF
≈ Veiling Waterfalls
对比度与无障碍
Ag
Fail白底
WCAG 1.32:1 · APCA Lc 16
Ag
AAA黑底
WCAG 15.90:1 · APCA Lc 88
最佳文字颜色: #000000
WCAG 15.90:1 (AAA) · APCA Lc 88
Contrast pairs
代码片段
CSS
:root {
--pink-currant: #fed5e9;
--pink-currant-rgb: 254 213 233;
--pink-currant-oklch: oklch(0.913 0.052 347.2);
}
.element {
color: var(--pink-currant);
background-color: hsl(331 95% 92%);
border-color: oklch(0.913 0.052 347.2);
}Tailwind CSS v4
@theme {
--color-pink-currant: #fed5e9;
--color-pink-currant-50: #ffeff7;
--color-pink-currant-100: #f6e1ea;
--color-pink-currant-200: #e7ccd8;
--color-pink-currant-300: #cdadbb;
--color-pink-currant-400: #b792a4;
--color-pink-currant-500: #a1788d;
--color-pink-currant-600: #886677;
--color-pink-currant-700: #6d515f;
--color-pink-currant-800: #503b46;
--color-pink-currant-900: #382931;
--color-pink-currant-950: #22161d;
}SCSS
$pink-currant: #fed5e9;
$pink-currant-rgb: 254, 213, 233;
$pink-currant-light: mix(#fff, $pink-currant, 20%);
$pink-currant-dark: mix(#000, $pink-currant, 20%);
.element {
color: $pink-currant;
box-shadow: 0 0 0 2px rgba($pink-currant, 0.35);
}