配色方案分享:从零搭建调色板

从用途出发

先想清楚页面拿来做什么:技术博客适合冷静的蓝灰,个人作品集可以更活泼。

60-30-10 法则

  • 60% 主色(背景、大面积区域)
  • 30% 辅助色(卡片、导航栏)
  • 10% 强调色(按钮、链接、高亮)

CSS 变量管理配色

:root {
  --color-bg: #ffffff;
  --color-primary: #2c3e50;
  --color-accent: #3498db;
}

一处修改,全局生效。


︵ ︶