分类: 开发工具
配色方案生成器
围绕一个颜色搭出一套配色
选一个基准色,按色轮关系得到成套配色:互补、邻近、三分、四分、单色或明暗阶。每个数值都能按 HEX、RGB、HSL 复制。
颜色数量
- 1
#0f7b63 - 2
#7b0f26 - 3
#073b30 - 4
#3b0712 - 5
#17ba97
全部数值
#0f7b63 #7b0f26 #073b30 #3b0712 #17ba97
调色板由你输入的颜色计算得出,不上传任何内容。
本页的所有处理都在浏览器中完成,不会上传任何内容。
这个工具能做什么
配色背后的关系其实是色轮上的几何:互补色在基准色对面,邻近色在两侧,三分色是等距的三个点。手工推算意味着转成 HSL、加角度、再转回来,尝试往往就停在这一步。这里替你旋转色相;当某种方案的色相数少于你要的色块数时,会改用明度分级而不是重复同一个颜色,所以从一对互补色生成五块,仍然是五个能用的颜色。每个色块都配有可读的标签,可以按你样式表使用的写法直接复制。
使用方法
- 选择或输入作为基准的颜色。
- 选择配色方案以及需要几个颜色。
- 复制单个数值,或一次复制整套配色。
隐私说明
本工具完全在你的浏览器中运行。输入的内容不会被上传、保存或分享,关闭标签页即随之消失。
常见问题
- 该从哪种方案开始?
- 想要安静、彼此关联就用邻近色;需要一个跳出来的强调色就用互补色;希望界面收敛、让内容当主角就用单色。
- 这些配色符合无障碍要求吗?
- 不会自动符合。配色讲的是和谐,不是对比度。上线前请用对比度检查工具逐一验证文字与背景的搭配。
- 我输入的颜色会被发送吗?
- 不会。调色板是在页面里根据你输入的颜色算出来的,不上传也不保存。