颜色选择器和转换器

颜色模型

颜色模型是将颜色描述为数字的系统。根据输出是屏幕、打印机还是设计规范，使用不同的模型。

RGB / RGBA

格式

RGB通过混合红、绿、蓝光来定义颜色。每个通道的范围为0到255。rgb(255, 0, 0)是纯红色。rgb(255, 255, 255)是白色。A（alpha）通道增加透明度，范围从0（完全透明）到1（完全不透明）。例如，rgba(255, 0, 0, 0.5)是半透明的红色。RGB是屏幕和数字显示器的原生颜色模型。

历史

RGB模型根植于19世纪的杨-亥姆霍兹三色视觉理论。詹姆斯·克拉克·麦克斯韦于1861年进行了首次RGB彩色摄影实验。随着1930年代至1940年代彩色CRT电视的发展，RGB成为电子显示器的标准，后来被计算机显示器所采用。sRGB色彩空间于1997年1月在HTML 3.2中被正式采用为网络标准。

HEX / HEXA

格式

HEX是使用十六进制表示RGB值的紧凑表示法。#FF0000等同于rgb(255, 0, 0)。每对十六进制数字代表一个通道：#RRGGBB。8位形式#RRGGBBAA添加了alpha通道，其中00为完全透明，FF为完全不透明。例如，#FF000080是50%不透明度的红色。#F00等简写形式会展开为#FF0000。

历史

十六进制颜色表示法起源于1990年代中期的早期网络浏览器。Mosaic和Netscape Navigator的初始版本继承了X11颜色名称系统。由Hakon Wium Lie和Bert Bos于1996年12月发布的CSS Level 1正式将十六进制三元组标准化为网络上指定颜色的主要方式。

HSL / HSLA

格式

HSL用色相、饱和度和亮度来描述颜色。色相是色轮上的角度（0-360）：0是红色，120是绿色，240是蓝色。饱和度（0-100%）控制颜色强度。亮度（0-100%）控制明暗，0%是黑色，100%是白色。HSL通常比RGB更直观，因为您可以独立调整亮度和饱和度。

历史

HSL由George H. Joblove和Donald Greenberg于1978年在Computer Graphics期刊的论文中首次描述。它的创建是为了解决RGB的一个根本问题：对人类来说，混合红、绿、蓝值是不直观的。HSL重新排列了RGB色彩空间，使艺术家和设计师可以从颜色（色相）、鲜艳度（饱和度）和明暗（亮度）的角度思考，这更接近人们自然描述颜色的方式。

HSV / HSB

格式

HSV（色相、饱和度、明度）与HSL类似，但使用"明度"（value）代替亮度（lightness）。在100%明度下，完全饱和的颜色是纯净且明亮的。HSV更自然地映射到颜色选择器的工作方式：饱和度/明度面板调整S和V，色相滑块调整H。

历史

HSV由Alvy Ray Smith于1978年8月在纽约理工学院计算机图形实验室工作时描述。它与HSL发表在同一期Computer Graphics期刊上。Smith为早期数字绘画程序设计了HSV，艺术家需要一种直观的方式在屏幕上选择颜色。HSV的圆柱模型使得将其实现为带有色相滑块和饱和度/明度面板的颜色选择器变得非常自然。

CMYK

格式

CMYK（青色、品红色、黄色、黑色/键色）用于印刷。RGB是加色混合（光），而CMYK是减色混合（墨水）。每个值表示该墨水的施加百分比。cmyk(0, 100, 100, 0)产生红色。RGB和CMYK之间的转换是近似的，因为它们覆盖不同的色域（色彩范围）。

历史

CMYK的基础可以追溯到Jacob Christoph Le Blon，他在1710年左右使用独立的铜版发明了半色调彩色印刷。他最初使用红、黄、蓝版，后来为了更清晰的轮廓和文字添加了黑色版。现代四色CMYK工艺于1890年代首次用于彩色报纸插图。黑色版被称为"键版"，因为它承载着其他版对齐（keyed）所依据的精细细节。

CSS颜色格式

现代CSS支持多种颜色表示法：

• #FF5733或#ff5733（HEX）
• rgb(255, 87, 51)或rgba(255, 87, 51, 0.5)
• hsl(14, 100%, 60%)或hsla(14, 100%, 60%, 0.5)
• 命名颜色：red、cornflowerblue、rebeccapurple（共148种命名颜色）