16进制颜色识别和搭配规律

在CSS中，经常会用到16进制的颜色来设置文本、背景、边框等颜色，但是对于一个纯前端来讲，16进制颜色的识别和搭配可能会较为陌生了 ,本文简单介绍一下16进制颜色的一些规律

16进制颜色的数值意义：

举个例子：比如 #1A2BF4（不区分大小写），前两位1A表示的是RGB中R（Red：红色），2B表示的是RGB中的G（Green：绿色），F4表示RGB中的B（Blue：蓝色），大小从00（0）到FF（255），数值越高，颜色越深。

16进制颜色的混合：

比如对于#FF0000，绿色和蓝色都是00，而红色则是FF，则该颜色#FF0000就是红色，#550000也是红色，但是要比#FF0000的红要浅。同理，#00FF00表示绿色，#0000FF表示蓝色。

根据颜色混合原理，其实是跟物理学是一样的，红绿混合（#FFFF00）为黄色，红蓝混合（#FF00FF）为紫红色（也叫洋红），蓝绿混合（#00FFFF）为青色，而红绿蓝混合（#FFFFFF）则是白色，

#000000为黑色。

将#XXYYZZ分组，XX为第一组，YY为第二组，ZZ为第三组。显然XX，YY，ZZ分别对应红绿蓝。

1.当第一组较大，其余两组较小时，颜色偏红。

2.当第二组较大，其余两组较小时，颜色偏绿。

3.当第三组较大，其余两组较小时，颜色偏蓝。

4.当第一、二组较大，第三组较小时，颜色偏黄。

5.当第一、三组较大，第二组较小时，颜色偏紫红。

6.当第二、三组较大，第一组较小时，颜色偏青。

7.三组比较接近或相等时，颜色为灰色。可以通过改变数值大小来调配灰色的深浅（也可以叫明暗，数值越高越明亮，低则较暗）。如#e3e3e3表示的灰色比#a3a3a3表示的灰色要浅，当接近（#FFFFFF白色）时，灰色就很浅了。

颜色的明暗（深浅）：

对于一个纯色的值是0~255即256种，对应00~FF，当颜色处于中间即 256/2=128（换算成16进制为80），可以看成为颜色明暗的分界线。如#800000为暗红，#008000为暗绿，数值更大，颜色变亮，数值越小，颜色越暗

16进制颜色识别和搭配规律相关推荐

16进制颜色识别和搭配规律 (实用）
原文出处:https://blog.csdn.net/weixin_39037804/article/details/100266599 在CSS中,经常会用到16进制的颜色来设置文本.背景.边框等颜 ...
iOS 将16进制颜色转换成UIColor
很多地方我们都使用16进制颜色,但iPhone使用的是UIColor对象,不直接支持16进制颜色,为此,需要我们手动将16进制颜色转换为UIColor - (UIColor *) hexStringT ...
iOS 直接使用16进制颜色
在做iOS开发时,一般我们会吸色,就是产品给的图我们一般会吸色,但是最近吸色时候,老大说有较大的颜色偏差,所以要求我们直接使用UI给出的额16进制颜色,你也可以搜索<RGB颜色值转换成十六进制颜 ...
POI 自定义16进制颜色导出
今天导入一个Excel 要求什么格式导入就怎么显示,包括字体颜色,还要怎么导出.这个poi导入的是16进制颜色,导出比较麻烦.具体参考以下代码吧 private CellStyle createSt ...
rgb与16进制颜色是如何相互转换的？
在css中定义颜色可以使用rgb颜色值,例:rgb(182, 0, 35):也可以使用16进制颜色值,例:#B60023.不管是rgb(182, 0, 35),还是#B60023都表示了同一种颜色,其 ...
iOS之颜色的调用、显示16进制颜色、渐变色
十六进制颜色 #import <UIKit/UIKit.h>NS_ASSUME_NONNULL_BEGIN@interface UIColor (HexColor) + (UIColor ...
Android内部颜色转16进制颜色
我们在Avtivity中设置控件的背景色的时候,会发现setBackgroundColor()居然需要int格式的颜色,本来以为是10进制的颜色,后来实验发现,不是10进制的,因为它是有负数的,它的范 ...
js自定义随机16进制颜色
js自定义随机16进制颜色 function colorfn() {let str = Math.random().toString().slice(2, 8);if (str.length < ...
js将16进制颜色转换成RGB格式
js代码如下: function hexToRgb(hex) { var result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(h ...

16进制颜色识别和搭配规律

在CSS中，经常会用到16进制的颜色来设置文本、背景、边框等颜色，但是对于一个纯前端来讲，16进制颜色的识别和搭配可能会较为陌生了 ,本文简单介绍一下16进制颜色的一些规律

16进制颜色识别和搭配规律相关推荐

最新文章

热门文章