命名颜色 · #FF99AA
Fight the Sunrise
Fight the Sunrise 即 #FF99AA：rgb(255 153 170)、hsl(350 100% 80%)、oklch(0.793 0.123 9.5)。查看浅色调、深色调、和谐色、WCAG 与 APCA 对比度，以及 CSS、Tailwind v4 和 SCSS 代码。
What does Red mean? → · Fight the Sunrise color name →
#FF99AA
oklch(0.793 0.123 9.5)
颜色转换
- HEX
- #ff99aa
- RGB
- rgb(255 153 170)
- HSL
- hsl(350 100% 80%)
- HWB
- hwb(350 60% 0%)
- OKLCH
- oklch(0.793 0.123 9.5)
- OKLab
- oklab(0.793 0.121 0.02)
- CIE Lab
- lab(74.52 40.5 8.44)
- LCH
- lch(74.52 41.37 11.8)
- CMYK
- cmyk(0% 40% 33% 0%)
浅色调 · 深色调 · 灰色调
浅色调
- FFA4B2
- FFAEBB
- FFB8C3
- FFC3CB
- FFCDD4
- FFD7DC
- FFE1E5
- FFEBEE
- FFF5F6
深色调
- DE8493
- BE707D
- 9E5D68
- 804A53
- 63383F
- 48272D
- 2E171B
- 16080B
- 030101
灰色调
- F297A6
- E695A1
- D9939D
- CD9099
- C08E95
- B38B91
- A7898C
- 9A8688
- 8D8384
配色和谐
互补色 +180°
- FF99AA
Fight the Sunrise
- 3ED4CC
≈ Medium Turquoise
类似色 -30° +30°
- FF99AA
Fight the Sunrise
- F09CD5
≈ Violet Kiss
- FF9F7F
≈ Orchid Orange
三角配色 +120° +240°
- FF99AA
Fight the Sunrise
- A2CB74
≈ Alverda
- 83C1FF
≈ Scenic Water
分裂互补色 +150° +210°
- FF99AA
Fight the Sunrise
- 6DD49F
≈ Van Gogh Green
- 49CEF1
≈ Thor’s Thunder
四角配色 +90° +180° +270°
- FF99AA
Fight the Sunrise
- CEBD58
≈ Limón Fresco
- 3ED4CC
≈ Medium Turquoise
- ADB4FF
≈ Winterspring Lilac
对比度与无障碍
Ag
Fail白底
WCAG 2.02:1 · APCA Lc 39
Ag
AAA黑底
WCAG 10.38:1 · APCA Lc 63
最佳文字颜色: #000000
WCAG 10.38:1 (AAA) · APCA Lc 63
Contrast pairs
代码片段
CSS
:root {
--fight-the-sunrise: #ff99aa;
--fight-the-sunrise-rgb: 255 153 170;
--fight-the-sunrise-oklch: oklch(0.793 0.123 9.5);
}
.element {
color: var(--fight-the-sunrise);
background-color: hsl(350 100% 80%);
border-color: oklch(0.793 0.123 9.5);
}Tailwind CSS v4
@theme {
--color-fight-the-sunrise: #ff99aa;
--color-fight-the-sunrise-50: #ffe7ec;
--color-fight-the-sunrise-100: #ffd8dd;
--color-fight-the-sunrise-200: #ffbfc7;
--color-fight-the-sunrise-300: #ef9da7;
--color-fight-the-sunrise-400: #dc7e8e;
--color-fight-the-sunrise-500: #c95f74;
--color-fight-the-sunrise-600: #aa5162;
--color-fight-the-sunrise-700: #88414f;
--color-fight-the-sunrise-800: #652e3b;
--color-fight-the-sunrise-900: #471f28;
--color-fight-the-sunrise-950: #2e0f16;
}SCSS
$fight-the-sunrise: #ff99aa;
$fight-the-sunrise-rgb: 255, 153, 170;
$fight-the-sunrise-light: mix(#fff, $fight-the-sunrise, 20%);
$fight-the-sunrise-dark: mix(#000, $fight-the-sunrise, 20%);
.element {
color: $fight-the-sunrise;
box-shadow: 0 0 0 2px rgba($fight-the-sunrise, 0.35);
}