设计师网址导航

配色没灵感?三个立刻能用的取色方法

配色是设计里最依赖感觉、其实最讲方法的一环。这篇记录三个立刻能上手的取色思路,以及配套的在线工具。

配色卡壳的时候,翻配色书或瞎调色轮都效率不高。下面这三个方法,每一个都能在十分钟内产出一组可用的配色,而且都有对应的在线工具兜底。

一、从一张照片里「偷」一组色

照片自带天然的色彩秩序:光线、环境、饱和度都是协调的。挑一张色调接近你项目气质的摄影作品,用取色工具吸出 3-5 个主色,一组配色就有了。

关键规则:只取 3-5 个色,一个主色、一个到两个辅助色、一个强调色。 取太多反而失去层次。

技巧:工具推荐
站内「在线配色」分类里收录的工具,多数自带「从图片提取色板」功能,上传图片即可,不用自己一个个吸管取。

二、用 60-30-10 法则分配比例

拿到色板之后,问题常常变成「每个颜色用多少」。经典答案是 60-30-10

比例 角色 例子
60% 主导色 背景、大面积留白
30% 辅助色 卡片、次级区块
10% 强调色 按钮、链接、徽标

比例不是铁律,但它能防止两个常见翻车:主色太碎(页面像打翻了调色盘),以及强调色用太多(所有东西都在喊,等于没有重点)。

三、给文字留一个「对比度检查」步骤

界面配色和海报配色最大的区别:界面里的颜色要承担可读性。深色背景上的灰字、低饱和按钮上的白字,都是高频翻车现场。定稿前把文字色和背景色丢进对比度检查工具里过一遍,正文至少要达到 WCAG 的 AA 标准。

这一步只需要几秒钟,却是业余配色和专业配色之间最明显的分界线。


选字体和选配色是同一类问题——不是没有资源,而是缺一个可靠的筛选标准。如果你也在折腾字体授权,可以看看之前整理的 免费商用字体清单。文中提到的工具都可以在导航站的「在线配色」分类里直接找到。

配色 设计方法

← 返回文章列表 · 去逛逛导航 →