zoukankan      html  css  js  c++  java
  • 【转】普通人的网页配色方案

    作者: 阮一峰

    http://www.ruanyifeng.com/blog/2019/03/coloring-scheme.html

    网页需要配色。一种好看、易用、符合心意的配色,是很不容易的,尤其在没有设计师时。

    一、Flat UI 色表

    最简单的方法是,从一个给定的色表选择颜色。我以前就是这样,主要根据 Flat UI 的色表配色。

    这个色表提供20种颜色(其实是10种,每种颜色有深和浅两个色调),对于简单的网页,基本够用了。实际效果可以参考 Flat UI 官网

    二、香港地铁色表

    后来,我听说香港地铁的每个车站,颜色都不一样。比如,中环是红色。

    金钟是蓝色,北角是橙色。

    这就是有名的香港地铁配色,目前一共有87种颜色。

    有人将这87种颜色,做成了色表,方便使用(源码)。

    我觉得,这个色表非常漂亮,符合大多数人的审美,87种颜色也足够用了。

    三、配色的经验法则

    除了使用色表,有人还提出一种配色的经验法则,也很值得参考。

    (1)网页的主题色

    深颜色使用cf69这四个字符,组合生成 RGB 色值,比如紫罗兰色是9966ff,靛蓝是6666ff,红色是ff6666

    淡颜色使用abcdef这六个字符,组合生成 RGB 色值。

    (2)文字的颜色

    文字最好不要使用全黑,而是使用深蓝色,可以从下面几种颜色挑。1a2a3a最深,2a3a4a次之,7a8a9a最浅。

    (3)背景色、阴影色、边框色

    背景色、阴影色、边框色都属于衬托,建议使用灰色,可以从aaaaabbbbbbccccccdddddd这四个色值挑选。

    References

    [1] Flat UI: https://flatuicolors.com/palette/defo
    [2] Flat UI 官网: http://designmodo.github.io/Flat-UI/
    [3] 色表: http://metrocolor.live/index.html
    [4] 源码: https://gist.github.com/ruanyf/e6c896df1c24d0236eb93d65144f2907
    [5] 配色的经验法则: https://sendwithses.gitbook.io/helpdocs/random-stuff/easy-to-remember-color-guide-for-non-designers

  • 相关阅读:
    2016孤独重视
    什么时候有空写一篇影评 《含泪活着》
    登录页面总结
    心跳机制
    心跳机制详解
    mysql数据库字符编码修改
    mysql20170404代码实现
    2017全面JAVA面试经历总结
    Oracle经典入门教程
    MySQL基础教程-绝对推荐
  • 原文地址:https://www.cnblogs.com/chenyablog/p/10614597.html
Copyright © 2011-2022 走看看