ylbtech-HTML-参考手册: HTML 拾色器
1.返回顶部
1、

HTML 拾色器

选取颜色:

 
 

或输入颜色值:

OK

或使用 HTML5:

选择的颜色:

黑色文本

阴影

白色文本

阴影

red
#ff0000
rgb(255, 0, 0)
hsl(0, 100%, 50%)
hsv(0, 100%, 100%)

淡 / 暗:

100%     #ffffff
95%     #ffe5e5
90%     #ffcccc
85%     #ffb3b3
80%     #ff9999
75%     #ff8080
70%     #ff6666
65%     #ff4d4d
60%     #ff3333
55%     #ff1a1a
     
50%   #ff0000
     
45%     #e60000
40%     #cc0000
35%     #b30000
30%     #990000
25%     #800000
20%     #660000
15%     #4d0000
10%     #330000
5%     #1a0000
0%     #000000

Hue

  Hue  Hex Rgb Hsl Hsv
  0  #ff0000 rgb(255, 0, 0) hsl(0, 100%, 50%) hsv(0, 100%, 100%)
  15  #ff4000 rgb(255, 64, 0) hsl(15, 100%, 50%) hsv(15, 100%, 100%)
  30  #ff8000 rgb(255, 128, 0) hsl(30, 100%, 50%) hsv(30, 100%, 100%)
  45  #ffbf00 rgb(255, 191, 0) hsl(45, 100%, 50%) hsv(45, 100%, 100%)
  60  #ffff00 rgb(255, 255, 0) hsl(60, 100%, 50%) hsv(60, 100%, 100%)
  75  #bfff00 rgb(191, 255, 0) hsl(75, 100%, 50%) hsv(75, 100%, 100%)
  90  #80ff00 rgb(128, 255, 0) hsl(90, 100%, 50%) hsv(90, 100%, 100%)
  105  #40ff00 rgb(64, 255, 0) hsl(105, 100%, 50%) hsv(105, 100%, 100%)
  120  #00ff00 rgb(0, 255, 0) hsl(120, 100%, 50%) hsv(120, 100%, 100%)
  135  #00ff40 rgb(0, 255, 64) hsl(135, 100%, 50%) hsv(135, 100%, 100%)
  150  #00ff80 rgb(0, 255, 128) hsl(150, 100%, 50%) hsv(150, 100%, 100%)
  165  #00ffbf rgb(0, 255, 191) hsl(165, 100%, 50%) hsv(165, 100%, 100%)
  180  #00ffff rgb(0, 255, 255) hsl(180, 100%, 50%) hsv(180, 100%, 100%)
  195  #00bfff rgb(0, 191, 255) hsl(195, 100%, 50%) hsv(195, 100%, 100%)
  210  #007fff rgb(0, 127, 255) hsl(210, 100%, 50%) hsv(210, 100%, 100%)
  225  #0040ff rgb(0, 64, 255) hsl(225, 100%, 50%) hsv(225, 100%, 100%)
  240  #0000ff rgb(0, 0, 255) hsl(240, 100%, 50%) hsv(240, 100%, 100%)
  255  #4000ff rgb(64, 0, 255) hsl(255, 100%, 50%) hsv(255, 100%, 100%)
  270  #7f00ff rgb(127, 0, 255) hsl(270, 100%, 50%) hsv(270, 100%, 100%)
  285  #bf00ff rgb(191, 0, 255) hsl(285, 100%, 50%) hsv(285, 100%, 100%)
  300  #ff00ff rgb(255, 0, 255) hsl(300, 100%, 50%) hsv(300, 100%, 100%)
  315  #ff00bf rgb(255, 0, 191) hsl(315, 100%, 50%) hsv(315, 100%, 100%)
  330  #ff0080 rgb(255, 0, 128) hsl(330, 100%, 50%) hsv(330, 100%, 100%)
  345  #ff0040 rgb(255, 0, 64) hsl(345, 100%, 50%) hsv(345, 100%, 100%)
  360  #ff0000 rgb(255, 0, 0) hsl(0, 100%, 50%) hsv(0, 100%, 100%)

HSL Saturation

  Sat  Hex Rgb Hsl Hsv
  100%  #ff0000 rgb(255, 0, 0) hsl(0, 100%, 50%) hsv(0, 100%, 100%)
  95%  #f90606 rgb(249, 6, 6) hsl(0, 95%, 50%) hsv(0, 97%, 98%)
  90%  #f20d0d rgb(242, 13, 13) hsl(0, 90%, 50%) hsv(0, 95%, 95%)
  85%  #ec1313 rgb(236, 19, 19) hsl(0, 85%, 50%) hsv(0, 92%, 93%)
  80%  #e61919 rgb(230, 25, 25) hsl(0, 80%, 50%) hsv(0, 89%, 90%)
  75%  #df2020 rgb(223, 32, 32) hsl(0, 75%, 50%) hsv(0, 86%, 88%)
  70%  #d92626 rgb(217, 38, 38) hsl(0, 70%, 50%) hsv(0, 82%, 85%)
  65%  #d22d2d rgb(210, 45, 45) hsl(0, 65%, 50%) hsv(0, 79%, 83%)
  60%  #cc3333 rgb(204, 51, 51) hsl(0, 60%, 50%) hsv(0, 75%, 80%)
  55%  #c63939 rgb(198, 57, 57) hsl(0, 55%, 50%) hsv(0, 71%, 78%)
  50%  #bf4040 rgb(191, 64, 64) hsl(0, 50%, 50%) hsv(0, 67%, 75%)
  45%  #b94646 rgb(185, 70, 70) hsl(0, 45%, 50%) hsv(0, 62%, 73%)
  40%  #b34d4d rgb(179, 77, 77) hsl(0, 40%, 50%) hsv(0, 57%, 70%)
  35%  #ac5353 rgb(172, 83, 83) hsl(0, 35%, 50%) hsv(0, 52%, 68%)
  30%  #a65959 rgb(166, 89, 89) hsl(0, 30%, 50%) hsv(0, 46%, 65%)
  25%  #9f6060 rgb(159, 96, 96) hsl(0, 25%, 50%) hsv(0, 40%, 63%)
  20%  #996666 rgb(153, 102, 102) hsl(0, 20%, 50%) hsv(0, 33%, 60%)
  15%  #936c6c rgb(147, 108, 108) hsl(0, 15%, 50%) hsv(0, 26%, 58%)
  10%  #8c7373 rgb(140, 115, 115) hsl(0, 10%, 50%) hsv(0, 18%, 55%)
  5%  #867979 rgb(134, 121, 121) hsl(0, 5%, 50%) hsv(0, 10%, 53%)
  0%  #808080 rgb(128, 128, 128) hsl(0, 0%, 50%) hsv(0, 0%, 50%)

HSL 淡 / 暗

  Lum  Hex Rgb Hsl Hsv
  100%  #ffffff rgb(255, 255, 255) hsl(0, 0%, 100%) hsv(0, 0%, 100%)
  95%  #ffe5e5 rgb(255, 229, 229) hsl(0, 100%, 95%) hsv(0, 10%, 100%)
  90%  #ffcccc rgb(255, 204, 204) hsl(0, 100%, 90%) hsv(0, 20%, 100%)
  85%  #ffb3b3 rgb(255, 179, 179) hsl(0, 100%, 85%) hsv(0, 30%, 100%)
  80%  #ff9999 rgb(255, 153, 153) hsl(0, 100%, 80%) hsv(0, 40%, 100%)
  75%  #ff8080 rgb(255, 128, 128) hsl(0, 100%, 75%) hsv(0, 50%, 100%)
  70%  #ff6666 rgb(255, 102, 102) hsl(0, 100%, 70%) hsv(0, 60%, 100%)
  65%  #ff4d4d rgb(255, 77, 77) hsl(0, 100%, 65%) hsv(0, 70%, 100%)
  60%  #ff3333 rgb(255, 51, 51) hsl(0, 100%, 60%) hsv(0, 80%, 100%)
  55%  #ff1a1a rgb(255, 26, 26) hsl(0, 100%, 55%) hsv(0, 90%, 100%)
  50%  #ff0000 rgb(255, 0, 0) hsl(0, 100%, 50%) hsv(0, 100%, 100%)
  45%  #e60000 rgb(230, 0, 0) hsl(0, 100%, 45%) hsv(0, 100%, 90%)
  40%  #cc0000 rgb(204, 0, 0) hsl(0, 100%, 40%) hsv(0, 100%, 80%)
  35%  #b30000 rgb(179, 0, 0) hsl(0, 100%, 35%) hsv(0, 100%, 70%)
  30%  #990000 rgb(153, 0, 0) hsl(0, 100%, 30%) hsv(0, 100%, 60%)
  25%  #800000 rgb(128, 0, 0) hsl(0, 100%, 25%) hsv(0, 100%, 50%)
  20%  #660000 rgb(102, 0, 0) hsl(0, 100%, 20%) hsv(0, 100%, 40%)
  15%  #4d0000 rgb(77, 0, 0) hsl(0, 100%, 15%) hsv(0, 100%, 30%)
  10%  #330000 rgb(51, 0, 0) hsl(0, 100%, 10%) hsv(0, 100%, 20%)
  5%  #1a0000 rgb(26, 0, 0) hsl(0, 100%, 5%) hsv(0, 100%, 10%)
  0%  #000000 rgb(0, 0, 0) hsl(0, 0%, 0%) hsv(0, 0%, 0%)

HSV Saturation

  Sat  Hex Rgb Hsl Hsv
  100%  #ff0000 rgb(255, 0, 0) hsl(0, 100%, 50%) hsv(0, 100%, 100%)
  95%  #ff0d0d rgb(255, 13, 13) hsl(0, 100%, 53%) hsv(0, 95%, 100%)
  90%  #ff1919 rgb(255, 25, 25) hsl(0, 100%, 55%) hsv(0, 90%, 100%)
  85%  #ff2626 rgb(255, 38, 38) hsl(0, 100%, 57%) hsv(0, 85%, 100%)
  80%  #ff3333 rgb(255, 51, 51) hsl(0, 100%, 60%) hsv(0, 80%, 100%)
  75%  #ff4040 rgb(255, 64, 64) hsl(0, 100%, 63%) hsv(0, 75%, 100%)
  70%  #ff4d4d rgb(255, 77, 77) hsl(0, 100%, 65%) hsv(0, 70%, 100%)
  65%  #ff5959 rgb(255, 89, 89) hsl(0, 100%, 68%) hsv(0, 65%, 100%)
  60%  #ff6666 rgb(255, 102, 102) hsl(0, 100%, 70%) hsv(0, 60%, 100%)
  55%  #ff7373 rgb(255, 115, 115) hsl(0, 100%, 73%) hsv(0, 55%, 100%)
  50%  #ff8080 rgb(255, 128, 128) hsl(0, 100%, 75%) hsv(0, 50%, 100%)
  45%  #ff8c8c rgb(255, 140, 140) hsl(0, 100%, 78%) hsv(0, 45%, 100%)
  40%  #ff9999 rgb(255, 153, 153) hsl(0, 100%, 80%) hsv(0, 40%, 100%)
  35%  #ffa6a6 rgb(255, 166, 166) hsl(0, 100%, 83%) hsv(0, 35%, 100%)
  30%  #ffb3b3 rgb(255, 179, 179) hsl(0, 100%, 85%) hsv(0, 30%, 100%)
  25%  #ffbfbf rgb(255, 191, 191) hsl(0, 100%, 88%) hsv(0, 25%, 100%)
  20%  #ffcccc rgb(255, 204, 204) hsl(0, 100%, 90%) hsv(0, 20%, 100%)
  15%  #ffd9d9 rgb(255, 217, 217) hsl(0, 100%, 93%) hsv(0, 15%, 100%)
  10%  #ffe6e6 rgb(255, 230, 230) hsl(0, 100%, 95%) hsv(0, 10%, 100%)
  5%  #fff2f2 rgb(255, 242, 242) hsl(0, 100%, 98%) hsv(0, 5%, 100%)
  0%  #ffffff rgb(255, 255, 255) hsl(0, 0%, 100%) hsv(0, 0%, 100%)

HSV 亮 / 暗

  Value  Hex Rgb Hsl Hsv
  100%  #ff0000 rgb(255, 0, 0) hsl(0, 100%, 50%) hsv(0, 100%, 100%)
  95%  #f20000 rgb(242, 0, 0) hsl(0, 100%, 48%) hsv(0, 100%, 95%)
  90%  #e60000 rgb(230, 0, 0) hsl(0, 100%, 45%) hsv(0, 100%, 90%)
  85%  #d90000 rgb(217, 0, 0) hsl(0, 100%, 43%) hsv(0, 100%, 85%)
  80%  #cc0000 rgb(204, 0, 0) hsl(0, 100%, 40%) hsv(0, 100%, 80%)
  75%  #bf0000 rgb(191, 0, 0) hsl(0, 100%, 38%) hsv(0, 100%, 75%)
  70%  #b30000 rgb(179, 0, 0) hsl(0, 100%, 35%) hsv(0, 100%, 70%)
  65%  #a60000 rgb(166, 0, 0) hsl(0, 100%, 33%) hsv(0, 100%, 65%)
  60%  #990000 rgb(153, 0, 0) hsl(0, 100%, 30%) hsv(0, 100%, 60%)
  55%  #8c0000 rgb(140, 0, 0) hsl(0, 100%, 28%) hsv(0, 100%, 55%)
  50%  #800000 rgb(128, 0, 0) hsl(0, 100%, 25%) hsv(0, 100%, 50%)
  45%  #730000 rgb(115, 0, 0) hsl(0, 100%, 23%) hsv(0, 100%, 45%)
  40%  #660000 rgb(102, 0, 0) hsl(0, 100%, 20%) hsv(0, 100%, 40%)
  35%  #590000 rgb(89, 0, 0) hsl(0, 100%, 18%) hsv(0, 100%, 35%)
  30%  #4d0000 rgb(77, 0, 0) hsl(0, 100%, 15%) hsv(0, 100%, 30%)
  25%  #400000 rgb(64, 0, 0) hsl(0, 100%, 13%) hsv(0, 100%, 25%)
  20%  #330000 rgb(51, 0, 0) hsl(0, 100%, 10%) hsv(0, 100%, 20%)
  15%  #260000 rgb(38, 0, 0) hsl(0, 100%, 8%) hsv(0, 100%, 15%)
  10%  #1a0000 rgb(26, 0, 0) hsl(0, 100%, 5%) hsv(0, 100%, 10%)
  5%  #0d0000 rgb(13, 0, 0) hsl(0, 100%, 3%) hsv(0, 100%, 5%)
  0%  #000000 rgb(0, 0, 0) hsl(0, 0%, 0%) hsv(0, 0%, 0%)

RGB (Red, Green, Blue)

Red Green Blue
255 0 0
     
 
 
rgb(255, 0, 0)  #ff0000
2、
2.返回顶部
 
3.返回顶部
 
4.返回顶部
 
5.返回顶部
1、
2、
 
6.返回顶部
 
作者：ylbtech
出处：http://ylbtech.cnblogs.com/
本文版权归作者和博客园共有，欢迎转载，但未经作者同意必须保留此段声明，且在文章页面明显位置给出原文连接，否则保留追究法律责任的权利。

HTML-参考手册: HTML 拾色器的更多相关文章

  1. 原生js编写的安全色拾色器

    <html > <head> <meta http-equiv="Content-Type" content="text/html; cha ...

  2. PS拾色器(前景色背景色)快捷键

    快捷键 I 是拾色器 X 是前后色切换

  3. Android Studio中如何设置颜色拾色器工具

    Android Studio如何设置颜色拾色器工具Color Picker? 你可能下载过一些获取颜色值的一些小工具, 这种方式获取颜色,需要先切换窗口转跳到桌面,然后打开拾色器小工具程序,然后去拾取 ...

  4. Linux下的高级拾色器—Pick

    导读 虽然大多数设计师都在使用 Mac,但也有一少部分在使用 Windows 甚至是 Linux 系统.在 Mac 和 Windows 中都有非常丰富的拾色器工具或插件可用,反而在开源界中这类颜色选择 ...

  5. 优动漫PAINT基础系列之拾色器教学

    在优动漫PAINT中有类似Photoshop的拾色器功能么?在优动漫PAINT中,可以直接输入颜色数值选择颜色么?当然是可以的啦!怎么呼出拾色器界面~ 看这边... 前段时间小编有收到一些小伙伴的疑问 ...

  6. 使用 HTML5 canvas制作拾色器

    自制的拾色器漂亮吧,哈哈 废话不多说直接上代码,希望可以帮到需要的朋友 <html><head>    <style>        .canvas_color{p ...

  7. 拾色器，可以取出电脑屏幕的任何颜色，ui以及程序员前端等常用软件，文件很小，300K

    作者:程序员小冰,CSDN博客:http://blog.csdn.net/qq_21376985,转载请说明出处. 今天给大家介绍一个小软件,挺实用的,叫做拾色器. 用途:取出电脑屏幕的任意颜色,当你 ...

  8. 使用css3和javascript开发web拾色器实例

    本实例中的web拾色器功能使用css3实现页面效果,即在页面上显示的元素用css3样式来实现的.再使用js生成拾色器颜色数据,并控制各元素的鼠标事件.当事件作为反应时,获取到对应的数据并显示颜色值. ...

  9. 小程序拾色器（颜色选择器）组件mini-color-picker

    特性: 现有方案分析 we-color-picker 需注意组件定位,操作不跟手不流畅,配置复杂.其定位会撑开原有页面,体验不佳.滑动距离按像素区分(固定),需考虑设备分辨率,不利于多端. Papae ...

随机推荐

  1. 解决Mac下使用root 权限依旧无法读写文件的问题

    当时在学习selenium的时候,需要配合使用chromedriver 和phantomjs 进行浏览器的自动化测试.. chromedriver下载结束后.无法移动到/user/bin下面 会提示权 ...

  2. 建站手册-网站建设： Web 标准

    ylbtech-建站手册-网站建设: Web 标准 1.返回顶部 1. http://www.w3school.com.cn/site/site_standards.asp 2. 2.返回顶部 1. ...

  3. 用 Flask 来写个轻博客 (36) — 使用 Flask-RESTful 来构建 RESTful API 之五

    目录 目录 前文列表 PUT 请求 DELETE 请求 测试 对一条已经存在的 posts 记录进行 update 操作 删除一条记录 前文列表 用 Flask 来写个轻博客 (1) - 创建项目 用 ...

  4. 将windows下的文件上传到Linux服务器上

    版权声明:本文为博主原创文章,遵循 CC 4.0 by-sa 版权协议,转载请附上原文出处链接和本声明.本文链接:https://blog.csdn.net/lx_Frolf/article/deta ...

  5. swoole webSocket 聊天室示例

    swoole1.7.9增加了内置的WebSocket服务器支持,通过几行PHP代码就可以写出一个异步非阻塞多进程的WebSocket服务器. 基于swoole websocket的用户上下线通知,在线 ...

  6. Scapy——Scrapy shell的使用

    在开发爬虫的使用,scrapy shell可以帮助我们定位需要爬取的资源 启动Scrapy Shell 在终端中输入以下内容即可启动scrapy shell,其中url是要爬取的页面,可以不设置 sc ...

  7. Notepad++使用-如何导出/导入配置文件

      复制 :    %APPDATA%\Notepad++ 转载于:https://www.cnblogs.com/dmcs95/p/11278982.html

  8. 一个spark streaming的黑名单过滤小例子

    > nc -lk 9999 20190912,sz 20190913,lin package com.lin.spark.streaming import org.apache.spark.Sp ...

  9. c# .netframwork 4.0 调用 2.0时报错 混合模式程序集是针对“v2.0.50727”版的运行时生成的，在没有配置其他信息的情况下，无法在 4.0 运行时中加载该程序集。

    “System.IO.FileLoadException”类型的未经处理的异常在 XXX.dll 中发生 其他信息: 混合模式程序集是针对“v2.0.50727”版的运行时生成的,在没有配置其他信息的 ...

  10. VINS 回环检测与全局优化

    回环检测 VINS回环检测与全局优化都在pose_graph.cpp内处理.首先在pose_graph_node加载vocabulary文件给BriefDatabase用,如果要加载地图,会loadP ...