命名颜色 · #FFDADC
Strawberry Blonde
Strawberry Blonde 即 #FFDADC:rgb(255 218 220)、hsl(357 100% 93%)、oklch(0.92 0.041 14.2)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度,以及 CSS、Tailwind v4 和 SCSS 代码。
What does Pink mean? → · Strawberry Blonde color name →
#FFDADC
oklch(0.92 0.041 14.2)
颜色转换
- HEX
- #ffdadc
- RGB
- rgb(255 218 220)
- HSL
- hsl(357 100% 93%)
- HWB
- hwb(357 85% 0%)
- OKLCH
- oklch(0.92 0.041 14.2)
- OKLab
- oklab(0.92 0.04 0.01)
- CIE Lab
- lab(90.25 13.49 4.04)
- LCH
- lch(90.25 14.08 16.7)
- CMYK
- cmyk(0% 15% 14% 0%)
浅色调 · 深色调 · 灰色调
浅色调
- FFDEDF
- FFE1E3
- FFE5E6
- FFE9EA
- FFEDED
- FFF0F1
- FFF4F4
- FFF8F8
- FFFBFB
深色调
- DEBDBF
- BEA2A3
- 9E8788
- 806C6E
- 635454
- 483C3C
- 2E2526
- 161111
- 030202
灰色调
- F2D1D2
- E5C7C9
- D8BEBF
- CBB5B6
- BEACAD
- B1A3A4
- A59A9B
- 989192
- 8C8989
配色和谐
互补色 +180°
- FFDADC
Strawberry Blonde
- C6EEED
≈ Morning Sky
类似色 -30° +30°
- FFDADC
Strawberry Blonde
- FADAEB
≈ Cherry Flower
- FEDDCF
≈ Peaceful Peach
三角配色 +120° +240°
- FFDADC
Strawberry Blonde
- D9EBD0
≈ Lantana Lime
- D3E7FF
≈ Veiling Waterfalls
分裂互补色 +150° +210°
- FFDADC
Strawberry Blonde
- CCEEDD
≈ Light Martian Moon
- C8EBF9
≈ Frosty Day
四角配色 +90° +180° +270°
- FFDADC
Strawberry Blonde
- E8E6C7
≈ Child of Heaven
- C6EEED
≈ Morning Sky
- E1E2FF
≈ Stoic White
对比度与无障碍
Ag
Fail白底
WCAG 1.28:1 · APCA Lc 14
Ag
AAA黑底
WCAG 16.31:1 · APCA Lc 90
最佳文字颜色: #000000
WCAG 16.31:1 (AAA) · APCA Lc 90
Contrast pairs
代码片段
CSS
:root {
--strawberry-blonde: #ffdadc;
--strawberry-blonde-rgb: 255 218 220;
--strawberry-blonde-oklch: oklch(0.92 0.041 14.2);
}
.element {
color: var(--strawberry-blonde);
background-color: hsl(357 100% 93%);
border-color: oklch(0.92 0.041 14.2);
}Tailwind CSS v4
@theme {
--color-strawberry-blonde: #ffdadc;
--color-strawberry-blonde-50: #fff1f1;
--color-strawberry-blonde-100: #f5e3e3;
--color-strawberry-blonde-200: #e5cece;
--color-strawberry-blonde-300: #ccafb0;
--color-strawberry-blonde-400: #b69597;
--color-strawberry-blonde-500: #a07b7e;
--color-strawberry-blonde-600: #87696a;
--color-strawberry-blonde-700: #6c5355;
--color-strawberry-blonde-800: #503d3e;
--color-strawberry-blonde-900: #372a2b;
--color-strawberry-blonde-950: #221718;
}SCSS
$strawberry-blonde: #ffdadc;
$strawberry-blonde-rgb: 255, 218, 220;
$strawberry-blonde-light: mix(#fff, $strawberry-blonde, 20%);
$strawberry-blonde-dark: mix(#000, $strawberry-blonde, 20%);
.element {
color: $strawberry-blonde;
box-shadow: 0 0 0 2px rgba($strawberry-blonde, 0.35);
}