关于颜色HSL(色度、饱和度、亮度)

最新推荐文章于 2022-04-27 22:19:09 发布
最新推荐文章于 2022-04-27 22:19:09 发布
阅读量1.1w 收藏 7
点赞数
分类专栏： 计算机图形学 文章标签： f# c 2010
  • 下面的每一个表代表一种色调。每个色调以30度间隔从色环取得。
  • 表中的X轴代表饱和度(100%, 75%, 50%, 25%, 0%)。
  • Y轴代表亮度。50% 属于 '正常'。
  •  0度   红
      
     100%75%50%25%0%
    100#FFFFFF#FFFFFF#FFFFFF#FFFFFF#FFFFFF
    88#FFBFBF#F7C7C7#EFCFCF#E7D7D7#DFDFDF
    75#FF8080#EF8F8F#DF9F9F#CFAFAF#BFBFBF
    63#FF4040#E75858#CF7070#B78787#9F9F9F
    50#FF0000#DF2020#BF4040#9F6060#808080
    38#BF0000#A71818#8F3030#784848#606060
    25#800000#701010#602020#503030#404040
    13#400000#380808#301010#281818#202020
    0#000000#000000#000000#000000#000000
     30度   红-黄 (=橙)
     饱和度   
     100%75%50%25%0%
    100#FFFFFF#FFFFFF#FFFFFF#FFFFFF#FFFFFF
    88#FFDFBF#F7DFC7#EFDFCF#E7DFD7#DFDFDF
    75#FFBF80#EFBF8F#DFBF9F#CFBFAF#BFBFBF
    63#FF9F40#E79F58#CF9F70#B79F87#9F9F9F
    50#FF8000#DF8020#BF8040#9F8060#808080
    38#BF6000#A76018#8F6030#786048#606060
    25#804000#704010#604020#504030#404040
    13#402000#382008#302010#282018#202020
    0#000000#000000#000000#000000#000000
     60度   黄
     饱和度   
     100%75%50%25%0%
    100#FFFFFF#FFFFFF#FFFFFF#FFFFFF#FFFFFF
    88#FFFFBF#F7F7C7#EFEFCF#E7E7D7#DFDFDF
    75#FFFF80#EFEF8F#DFDF9F#CFCFAF#BFBFBF
    63#FFFF40#E7E758#CFCF70#B7B787#9F9F9F
    50#FFFF00#DFDF20#BFBF40#9F9F60#808080
    38#BFBF00#A7A718#8F8F30#787848#606060
    25#808000#707010#606020#505030#404040
    13#404000#383808#303010#282818#202020
    0#000000#000000#000000#000000#000000
     90度   黄-绿
     饱和度   
     100%75%50%25%0%
    100#FFFFFF#FFFFFF#FFFFFF#FFFFFF#FFFFFF
    88#DFFFBF#DFF7C7#DFEFCF#DFE7D7#DFDFDF
    75#BFFF80#BFEF8F#BFDF9F#BFCFAF#BFBFBF
    63#9FFF40#9FE758#9FCF70#9FB787#9F9F9F
    50#80FF00#80DF20#80BF40#809F60#808080
    38#60BF00#60A718#608F30#607848#606060
    25#408000#407010#406020#405030#404040
    13#204000#203808#203010#202818#202020
    0#000000#000000#000000#000000#000000
     120度   绿
     饱和度   
     100%75%50%25%0%
    100#FFFFFF#FFFFFF#FFFFFF#FFFFFF#FFFFFF
    88#BFFFBF#C7F7C7#CFEFCF#D7E7D7#DFDFDF
    75#80FF80#8FEF8F#9FDF9F#AFCFAF#BFBFBF
    63#40FF40#58E758#70CF70#87B787#9F9F9F
    50#00FF00#20DF20#40BF40#609F60#808080
    38#00BF00#18A718#308F30#487848#606060
    25#008000#107010#206020#305030#404040
    13#004000#083808#103010#182818#202020
    0#000000#000000#000000#000000#000000
     150度   绿-青
     饱和度   
     100%75%50%25%0%
    100#FFFFFF#FFFFFF#FFFFFF#FFFFFF#FFFFFF
    88#BFFFDF#C7F7DF#CFEFDF#D7E7DF#DFDFDF
    75#80FFBF#8FEFBF#9FDFBF#AFCFBF#BFBFBF
    63#40FF9F#58E79F#70CF9F#87B79F#9F9F9F
    50#00FF80#20DF80#40BF80#609F80#808080
    38#00BF60#18A760#308F60#487860#606060
    25#008040#107040#206040#305040#404040
    13#004020#083820#103020#182820#202020
    0#000000#000000#000000#000000#000000
     180度   青
     饱和度   
     100%75%50%25%0%
    100#FFFFFF#FFFFFF#FFFFFF#FFFFFF#FFFFFF
    88#BFFFFF#C7F7F7#CFEFEF#D7E7E7#DFDFDF
    75#80FFFF#8FEFEF#9FDFDF#AFCFCF#BFBFBF
    63#40FFFF#58E7E7#70CFCF#87B7B7#9F9F9F
    50#00FFFF#20DFDF#40BFBF#609F9F#808080
    38#00BFBF#18A7A7#308F8F#487878#606060
    25#008080#107070#206060#305050#404040
    13#004040#083838#103030#182828#202020
    0#000000#000000#000000#000000#000000
     210度   青-蓝
     饱和度   
     100%75%50%25%0%
    100#FFFFFF#FFFFFF#FFFFFF#FFFFFF#FFFFFF
    88#BFDFFF#C7DFF7#CFDFEF#D7DFE7#DFDFDF
    75#80BFFF#8FBFEF#9FBFDF#AFBFCF#BFBFBF
    63#409FFF#589FE7#709FCF#879FB7#9F9F9F
    50#0080FF#2080DF#4080BF#60809F#808080
    38#0060BF#1860A7#30608F#486078#606060
    25#004080#104070#204060#304050#404040
    13#002040#082038#102030#182028#202020
    0#000000#000000#000000#000000#000000
     240度   蓝
     饱和度   
     100%75%50%25%0%
    100#FFFFFF#FFFFFF#FFFFFF#FFFFFF#FFFFFF
    88#BFBFFF#C7C7F7#CFCFEF#D7D7E7#DFDFDF
    75#8080FF#8F8FEF#9F9FDF#AFAFCF#BFBFBF
    63#4040FF#5858E7#7070CF#8787B7#9F9F9F
    50#0000FF#2020DF#4040BF#60609F#808080
    38#0000BF#1818A7#30308F#484878#606060
    25#000080#101070#202060#303050#404040
    13#000040#080838#101030#181828#202020
    0#000000#000000#000000#000000#000000
     270度   蓝-紫
     饱和度   
     100%75%50%25%0%
    100#FFFFFF#FFFFFF#FFFFFF#FFFFFF#FFFFFF
    88#DFBFFF#DFC7F7#DFCFEF#DFD7E7#DFDFDF
    75#BF80FF#BF8FEF#BF9FDF#BFAFCF#BFBFBF
    63#9F40FF#9F58E7#9F70CF#9F87B7#9F9F9F
    50#8000FF#8020DF#8040BF#80609F#808080
    38#6000BF#6018A7#60308F#604878#606060
    25#400080#401070#402060#403050#404040
    13#200040#200838#201030#201828#202020
    0#000000#000000#000000#000000#000000
     300度   紫
     饱和度   
     100%75%50%25%0%
    100#FFFFFF#FFFFFF#FFFFFF#FFFFFF#FFFFFF
    88#FFBFFF#F7C7F7#EFCFEF#E7D7E7#DFDFDF
    75#FF80FF#EF8FEF#DF9FDF#CFAFCF#BFBFBF
    63#FF40FF#E758E7#CF70CF#B787B7#9F9F9F
    50#FF00FF#DF20DF#BF40BF#9F609F#808080
    38#BF00BF#A718A7#8F308F#784878#606060
    25#800080#701070#602060#503050#404040
    13#400040#380838#301030#281828#202020
    0#000000#000000#000000#000000#000000
     330度   紫-红
     饱和度
     100%75%50%25%0%
    100#FFFFFF#FFFFFF#FFFFFF#FFFFFF#FFFFFF
    88#FFBFDF#F7C7DF#EFCFDF#E7D7DF#DFDFDF
    75#FF80BF#EF8FBF#DF9FBF#CFAFBF#BFBFBF
    63#FF409F#E7589F#CF709F#B7879F#9F9F9F
    50#FF0080#DF2080#BF4080#9F6080#808080
    38#BF0060#A71860#8F3060#784860#606060
    25#800040#701040#602040#503040#404040
    13#400020#380820#301020#281820#202020
    0
金卯刀
关注
专栏目录
css零到一基础教程009：CSS HSL 颜色
kerryqpw的博客
03-18 854
HSL 值 在 CSS 中，可以使用色相、饱和度和明度（HSL）来指定颜色，格式如下： hsla(hue, saturation, lightness) 色相（hue）是色轮上从 0 到 360 的度数。0 是红色，120 是绿色，240 是蓝色。 饱和度（saturation）是一个百分比值，0％ 表示灰色阴影，而 100％ 是全色。 亮度（lightness）也是百分比，0％ 是黑色，50％ 是既不明也不暗，100％是白色。 请通过混合以下 HSL 值来进行实验： 实例 &lt..
色调、饱和度、色度、亮度
qq_52432727的博客
09-23 2685
色调、饱和度、色度、亮度概念区分
颜色HSL（色调，饱和度，亮度）
07-28 5179
资料来源：W3C下面的每一个表代表一种色调。每个色调以30度间隔从色环取得。表中的X轴代表饱和度(100%, 75%, 50%, 25%, 0%)。Y轴代表亮度。50% 属于 '正常'。   0度   红       100% 75% 50% 25% 0% 100 #FFFFFF #FFFFFF #FFFFFF #FFFFF
HSL颜色记录
ypuzhiyuan的博客
04-27 644
HSL H色调S饱和度L亮度 H ：0/360/-360红色 60黄色 120绿色 180情色 240蓝色 300洋红色 S 0%-100% 0%表示没有使用该颜色 100%饱和度最高 L ；0%最暗-100%亮度最高 除了IE浏览器。其他浏览器都兼容的很好 样例 li{ display: block; width...
HSL颜色表
不怕不聪明，只怕聪明的人比我努力
03-15 9345
各种工具的一个网站：http://www.tool.la/ColorHSL/ --------------------------------------------------------------------------------------------------------- 这是脖主归纳的，好记多了吧：  红（0/360）  橙/红-黄（30）  黄（60）
CSS第二章：3.颜色单位（HSL值、HSLA值）
励志成为会前后端、运维、云服务、嵌入式开发、AI和自动化技术的创业小老板！
04-27 1687
总览1.HSL值H - 色相，S - 饱和度，L - 亮度2.HSLA值A - 透明度一、色相 - H1.取值范围：0~360二、饱和度 - S1.取值范围：0~100%、亮度 - L1.取值范围：0~100% 四、HSL值 · 实操 1.HTML代码： 2.CSS代码： 3.实际显示 五、HSLA 1.无非就是加了一个参数负责调节透明度，参数取值范围为0~1 2.参考 RGBA 透明度调节：RGBA透明度调节教程 ...
Matlab实现图像色度饱和度变换,含GUI界面
08-28
在实现色度饱和度变换时，通常需要将图像从RGB色彩空间转换到HSV或HSL色彩空间。这是因为在这两种色彩空间中，饱和度是一个独立的分量，易于操作。转换完成后，可以单独修改饱和度值，然后再转回RGB空间以显示结果...
对彩色图像进行调整。自动对亮度、色度和饱和度这三个参数进行调整。
06-04
饱和度的调整通常涉及到色彩空间的转换，如从RGB到HSV（色相、饱和度、价值）或HSL（色相、饱和度、亮度）空间，因为这些色彩空间更容易直接操作饱和度。 下面，我们以Python的PIL（Python Imaging Library）或者...
python利用生成器随机调整图片对比度，饱和度，亮度，色度
moonnightlight
04-24 3720
直接上代码 # -*- coding: utf-8 -*- """ Created on Thu Apr 23 22:29:54 2020 @author: Administrator """ import numpy as np import cv2 from PIL import Image from matplotlib import pyplot as plt #VisualEffec...
RGB HSL颜色模式转换
01-04
rgb hsl 六个滑块，直观了解各值对颜色的影响，拖动任意滑块即时观察颜色转换效果
android 改变图像亮度,【Android】使用SeekBar调整图像的色度、饱和及度亮度
weixin_36212459的博客
05-28 1096
SeekBar通过滑块位置来标识数值，且允许用户拖动滑块来改变值。下面利用三条SeeKBar来调整图片的色度(Hue)、饱和度(Saturation)、亮度(Lum)。布局文件为一个ImageView，三条SeekBar，布局简单，在此省略。首先创建一个图像处理类ImageHelper:public class ImageHelper {public static Bitmap handleIma...
绘制色调、饱和度渐变排列的图像（利用Python实现）
1nsights的博客
12-10 2282
数字图像处理作业1 绘制色调、饱和度渐变排列的图像（利用Python实现） 作业的思路： 绘制色调、饱和度渐变排列的图像 —> 随着图像像素坐标的变换，色调的值、饱和度的值按一定规律变化即可 —> 利用循环，随着像素坐标变化，赋予不同 的色调，饱和度的值 PIL的ImageDraw模块中的point函数可以对图像单个像素赋予hsl形式的值，使用的格式为： ImageDraw.point(xy, fill=None) 其中xy是表示坐标的元组，fill是填充的颜色 我们需要利用色调和饱和度的信息
HSL制作配色表
di84186的博客
04-14 422
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>HSL制作配色表</title> <style> .table-wrap { width: ...
颜色和单位
a828524的博客
10-21 405
颜色单位 1.命名颜色 如red white gray olive（橄榄色） 2.16进制颜色（红 绿 蓝 基本色）如#afaf56 （0~9 a~f） 3.rgb（0~255，0~255，0~255）或rgb（10%，0%，100%）不是所有浏览器都支持rgb的百分比 4.rgba（0~255，0~255，0~255，0~1） 0~1表示不透明度黑色啦 alpha ...
色相、色彩、色度和色调
飞天狐的专栏
08-20 8093
色相、色彩、色度和色调 场景：PM和UI讨论广告的背景颜色中，PM：“这个广告的背景和内容采用差不多的颜色，区分度会不会不高。”UI：“不会啊，我专门使用单色相配合不同的饱和度和亮度设计的。”PM不停的点着自己快断的脑袋，其实不知道UI说的是什么意思。 本人为了跟充满艺术气质的UI设计师更好的沟通，能够听懂一点在我耳中的“天籁之音”。暗地里学习了一下UI设计，在家里啃着一本《众妙之
整理：opencv颜色灰度值、HSV和HSL
沉迷单车的追风少年
08-01 7190
前言： 在opencv很多函数中都需要设定灰度值参数，但是我们很多时候并不知道我们的灰度值是多少，我整理了两种方法如下 1. 查颜色表，第一表查看颜色对应的灰度值的大概表示，用第二幅图估计颜色的灰度值的大致大小，虽有些粗略，但是挺实用 最左边值是255，最右边的值是0（原图很清晰，传上来就不行了……） 2.常见颜色HSV值，其中V是Value，即灰度值。如下表，最后两行就是灰度值的表...
CSS颜色---RGB、HSL、Hex 网页色彩码
ssisse的博客
08-18 1528
網頁使用到的色彩標示方法中，從古早時期大家都在用的16進位碼(#000000)、RGB色值標示、HSL色彩標示，其中網頁設計師最常使用的16進位色碼標示法，設計師究竟了解多少？而16進位碼又是如何計算色彩的呢？有沒有辦法直接腦袋就把色彩算出來？HSL色彩該如何運用與記憶？有沒有什麼秘訣或小技巧？一連串的問題就跟著Amos繼續看下去。 先來說說RGB色彩 ( RGB color ) RG
图像的RGB表示和YUV表示及亮度和色度的转换关系
jinking01的专栏
09-02 7451
1、RGB表示方式 1.1、浮点表示 归一化表示，取值范围0.0~1.0，如openGL对每个子像素点的表示方式。 1.2、整数表示 取值范围0～255或者00～FF，8bit表示一个子像素。 如图像格式RGBA_8888，表示4*8bit表示一个像素， 而RGB_565用5 + 6 + 5 bit表示一个像素。 一张1280 * 720， RGBA_8888格式的图片的大小 = 1280 * 720 * 32bit = 1280 * 720 * 32 / 8 byte，也是位图bitmap在内存中
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值