复制色值
HEX / RGB / CMYK 一键复制给研发。
HEX
#4C5578
RGB
rgb(76, 85, 120)
CMYK
37, 29, 0, 53
搭配方案
单色、类似色、互补色、三色组，直接复制使用。
Monochrome Depth
Light and dark steps around the hero color.
#202332
1
#383E57
2
#4C5578
3
#5F6A95
4
#838CAF
5
Analogous Flow
Neighbors on the color wheel for a soft gradient story.
#405864
1
#4C5E76
2
#4C5578
3
#4D4C76
4
#645889
5
Complementary Contrast
Opposites that add clarity and focus.
#4C5578
1
#645C40
2
#8F855B
3
#363945
4
#8A8C93
5
Triadic Balance
Three evenly spaced hues for versatile layouts.
#4C5578
1
#764C54
2
#54764C
3
#424657
4
#737A96
5
Split Complementary
Balanced contrast with two supporting accents.
#4C5578
1
#76584C
2
#6A764C
3
#2F3341
4
#7D84A1
5
导出
复制 CSS 变量或 Tailwind 配置。
#4C5578
CSS Variables
:root {
--year-base: #4C5578;
--year-base-contrast: #FFFFFF;
--year-accent-1: #383E57;
--year-accent-2: #4C5578;
--year-accent-3: #5F6A95;
--year-surface: #f8fafc;
}Tailwind Config
theme: {
extend: {
colors: {
primary: 'var(--year-base)',
accent: 'var(--year-accent-1)',
surface: 'var(--year-surface)',
},
},
},场景预览
UI、海报、电商示例。
UI 界面
海报 / 社交
Launch Campaign
Design with #4C5578
电商主图
New Drop · #4C5578-20%
Primary CTA
Secondary
使用建议
Summary
带靛紫调的暮色蓝，兼具科幻感与低奢气质。
Notes
可做深色界面壳层或中性色上的奢华强调。配浅紫、银灰或柔和珊瑚能提亮，文字需选浅色确保可读性。
Tips
- 标签: ui
- 标签: branding
- 标签: fashion
应用资源
Speed up screens with ready-made UI kits, icons, and design tokens.
UI kit & icons