学UI设计中有啥配色网站推荐?

html-css032

学UI设计中有啥配色网站推荐?,第1张

1.Flat UI Colors

这个网站提供了多种主流 UI 配色方案,有明度和饱和度的对比,点击色块就可以直接复制颜色,非常方便。

2.Colorhunt

这是一个非常简洁,但非常好用的配色网站,你可以自己创造并分享喜欢的色彩搭配,也可以在这里查看大师们常用的配色方案,还可以给喜欢的配色点赞。

3.LOL Colors

这是一个非常简洁,但非常好用的配色网站,设计师可们可以在这里找到很多色彩组合,把鼠标移动到不同颜色的水滴上会提示色彩代码(Hex Code)的颜色值。

4.WebGradients

这个网站收录了非常多的渐变色彩,大概有 180 种,都非常的美观。点击一下就色彩就可以大图预览,喜欢的话可以下载 png 图片,很方便。这些渐变色作为PPT的背景非常合适。

5.Uigradients

以分享美丽渐变色彩为主的分享站,里面接近上百种渐变配色方案,设计师可根据自己风格来选择搭配。

6.adobe color cc

这款是 Adobe 官方出品的配色工具,里面有很多配色的模式,比如单色系,三元色,互补色等,它可以通过不同色彩规则来提供配色参考。

希望对你有帮助~

2018.7.16

em,px,都为长度单位,CSS直接设置就可以。

%不是一个长度单位,比如2%就是一个完整的值,是一个整体,比如0.02是一个值,没错,2%也同样是值(出处:《css世界》)

注:有一个特殊情况需要注意,如果,p为span的父元素(如下情况)

css里设置为

p{font-size:14px}

span{font-size:0.8em}

自然就会继承父元素,然后再进行子元素的独特性,即(14*0.8=11.2px)以父元素的px为单位。

简写:当值为0px时,可以简写为0。(如下图所示)

颜色设置有 三种方法

第一种就是直接用英文名字(p{color:red})第二种就是根据R(red)G(green)B(blue)颜色的比例来配色,每一项地值在0-255之间,也可以用百分比(p{color:rgb(133,45,200)})第三种就是常用的,原理也是rgb设置,但是将255变成了十六进制(p{color:#336699})

补充:background-color属性接受任意合法的CSS颜色值,如预定义颜色名、十六进制数值、RGB值、RGB百分比、RGBA值、HSL值、HSLA值(这些都是颜色设置的)

tips:1.十六进制的如果每两个之间数字相同可以简写成一个,如上面的p{color:#336699}为p{color:#369}

2.RGB和我当时学的美术的三原色相类似,美术三原色为红黄蓝。(三间色可以直接用三原色调出,红黄为橙,红蓝为紫,黄蓝为绿)

之前一直分不太清楚,今天试了一下,然后懂了。(如下图)

margin为边界,又可以叫做外边框;padding为内边框,也为“填充”。

流动模型为网页的默认模型,流动模型的块元素是自上而下,行元素是从左到右显示。

模型移动(以层模型中的元素为例)

向右移动和向下移动不是我想的right:XXbottom:XX

而是距离左边XX,距离上面XX,距离原来的0,动了XX那么多,自然就是向那里移动了XX。(默认位置为左上角)

另外,层模型使得元素块移动后,它移动前的仍然保留。