扁平化设计配色工具

配色方案

颜色是扁平化设计的重中之重。颜色的明暗,色彩的醒目程度,配色方案是单调还是多彩,这都非常值得研究。扁平化设计一般综合运用多种配色手法来创造一种优秀的视觉体验。

醒目明亮的颜色能够增加视觉元素的趣味性,看起来很有国际范儿。在色彩的饱和度、深浅、明暗上要下功夫。

“单调”的配色方案在扁平化设计中很流行。通常会选择一些具有生气的颜色,然后在色调上进行调整。

多彩风格是另外一种选择。不同的页面和面板使用不同的颜色,整体效果非常棒。呢个能达到整体的层次感和有序感。

Flat design color palette (free)

pre-made code from Lucas Cobb.提供20种扁平化设计中常用的颜色。

codepen

Flat UI colors (free)

Flat UI colors非常简单的网站,展示了扁平化设计中最为流行的色调。用户点击便可以得到RGB和HEX色码。

flat-ui-colors

Adobe Kuler (free)

Adobe’s Kuler 的调色生成工具可以打造出多种多样的扁平化风格配色方案。

kuler

ColourLovers (free)

ColourLovers中的用户已经打造出多种多样的配色方案。用户可以评论、投票,可以从中获取设计的灵感,如果你不想使用比较陈旧的扁平化设计配色,那么来这里来看看吧。

colourlovers


关注我

我的微信公众号:前端开发博客,在后台回复以下关键字可以获取资源。

  • 回复「小抄」,领取Vue、JavaScript 和 WebComponent 小抄 PDF
  • 回复「Vue脑图」获取 Vue 相关脑图
  • 回复「思维图」获取 JavaScript 相关思维图
  • 回复「简历」获取简历制作建议
  • 回复「简历模板」获取精选的简历模板
  • 回复「加群」进入500人前端精英群
  • 回复「电子书」下载我整理的大量前端资源,含面试、Vue实战项目、CSS和JavaScript电子书等。
  • 回复「知识点」下载高清JavaScript知识点图谱

每日分享有用的前端开发知识,加我微信:caibaojian89 交流