最接近的命名颜色 · #FBE4E9
#FBE4E9
最接近的命名颜色: Porcelain Skin
#FBE4E9(rgb(251 228 233)、hsl(347 74% 94%)、oklch(0.939 0.026 2.8))最接近命名颜色 Porcelain Skin。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度,以及 CSS、Tailwind v4 和 SCSS 代码。
#FBE4E9
oklch(0.939 0.026 2.8)
颜色转换
- HEX
- #fbe4e9
- RGB
- rgb(251 228 233)
- HSL
- hsl(347 74% 94%)
- HWB
- hwb(347 89% 2%)
- OKLCH
- oklch(0.939 0.026 2.8)
- OKLab
- oklab(0.939 0.026 0.001)
- CIE Lab
- lab(92.58 8.74 0.57)
- LCH
- lch(92.58 8.76 3.7)
- CMYK
- cmyk(0% 9% 7% 2%)
浅色调 · 深色调 · 灰色调
浅色调
- FBE7EB
- FCE9ED
- FCECF0
- FDEFF2
- FDF1F4
- FEF4F6
- FEF7F8
- FEFAFB
- FFFCFD
深色调
- DAC6CB
- BAA9AD
- 9C8D90
- 7E7274
- 61585A
- 463F41
- 2D2829
- 151213
- 030303
灰色调
- EEDADE
- E1CFD3
- D5C5C8
- C8BBBE
- BCB1B3
- AFA7A9
- A39D9E
- 979394
- 8C8A8A
配色和谐
互补色 +180°
- FBE4E9
Porcelain Skin
- D9F1EC
≈ Green Frosting
类似色 -30° +30°
- FBE4E9
Porcelain Skin
- F6E5F2
≈ Soft Lavender
- FCE5E0
≈ Sweet Nothing
三角配色 +120° +240°
- FBE4E9
Porcelain Skin
- E7EEDB
≈ Diluted Lime
- DDEDFB
≈ Hoarfrost
分裂互补色 +150° +210°
- FBE4E9
Porcelain Skin
- DFF0E3
≈ Ice-Cold White
- D8F0F5
≈ Let It Snow
四角配色 +90° +180° +270°
- FBE4E9
Porcelain Skin
- F1EBD8
≈ Orchid White
- D9F1EC
≈ Green Frosting
- E5EAFD
≈ Icy Lilac
对比度与无障碍
Ag
Fail白底
WCAG 1.20:1 · APCA Lc 10
Ag
AAA黑底
WCAG 17.37:1 · APCA Lc 94
最佳文字颜色: #000000
WCAG 17.37:1 (AAA) · APCA Lc 94
Contrast pairs
代码片段
CSS
:root {
--porcelain-skin: #fbe4e9;
--porcelain-skin-rgb: 251 228 233;
--porcelain-skin-oklch: oklch(0.939 0.026 2.8);
}
.element {
color: var(--porcelain-skin);
background-color: hsl(347 74% 94%);
border-color: oklch(0.939 0.026 2.8);
}Tailwind CSS v4
@theme {
--color-porcelain-skin: #fbe4e9;
--color-porcelain-skin-50: #fcf2f4;
--color-porcelain-skin-100: #f0e4e7;
--color-porcelain-skin-200: #dfd0d3;
--color-porcelain-skin-300: #c4b2b5;
--color-porcelain-skin-400: #ad989d;
--color-porcelain-skin-500: #967f84;
--color-porcelain-skin-600: #7f6c70;
--color-porcelain-skin-700: #65565a;
--color-porcelain-skin-800: #4a3f42;
--color-porcelain-skin-900: #342b2d;
--color-porcelain-skin-950: #1f191a;
}SCSS
$porcelain-skin: #fbe4e9;
$porcelain-skin-rgb: 251, 228, 233;
$porcelain-skin-light: mix(#fff, $porcelain-skin, 20%);
$porcelain-skin-dark: mix(#000, $porcelain-skin, 20%);
.element {
color: $porcelain-skin;
box-shadow: 0 0 0 2px rgba($porcelain-skin, 0.35);
}