顏色理論/程式設計師的顏色

如何在你的程式中使用顏色

計算機圖形工作流程

步驟

• 檢查你的資料（型別、範圍）
• 檢查你的圖形裝置的顏色配置檔案
• 裝置校準
• 選擇你想突出顯示的資料的特徵
• 應用漸變
• 檢查結果/最佳化它

理論

• 可汗學院：皮克斯顏色

顏色管理

在數字成像系統中，顏色管理（或顏色管理）是在各種裝置（如影像掃描器、數碼相機、顯示器、電視螢幕、膠片印表機、計算機印表機、膠印機和相應的介質）之間對顏色表示進行受控轉換的過程。

顏色管理的主要目標是在**顏色裝置之間獲得良好匹配**；例如，影片的一幀的顏色應該在計算機 LCD 顯示器、等離子電視螢幕和印刷海報上看起來相同。顏色管理有助於在所有這些裝置上實現相同的顯示效果，前提是這些裝置能夠提供所需的色度強度。對於攝影，列印件或線上畫廊的顯示效果往往至關重要，需要和預期一致。顏色管理不能保證完全相同的顏色再現，因為這很少可能實現，但至少可以更好地控制可能發生的任何變化。

步驟

• 每個圖形裝置（掃描器、數碼相機、顯示器和印表機）以及作業系統的配置檔案

渲染意圖

• 感知渲染：影像將在列印件或顯示器上再現
• 色度渲染：影像將模擬一個裝置到另一個裝置，例如列印件到顯示器（校樣）
• 飽和度渲染：具有最大色彩度的商務圖形列印

**顏色保真度**是指從影像建立到跨多個目標輸出的顏色資料的成功互操作性，從而可以實現符合使用者意圖的顏色再現質量。

首先

• 顏色管理系統 (CMS) 作為作業系統的一部分
  • Linux_color_management，Ubuntu 顏色管理
    • Little CMS

顏色位深度

• 同一張影像在五個不同的顏色深度上的顯示效果，顯示了結果（壓縮）檔案大小。8 位及更小的影像使用 自適應調色盤，因此質量可能比某些系統提供的更好。
• 
  24 位.png 16,777,216 種顏色
  (影像中為 57,178 種)
  98 KB
• 
  8 位.png 256 種顏色
  (影像中為 249 種)
  37 KB (−62%)
• 
  4 位.png 16 種顏色
  13 KB (−87%)
• 
  2 位.png 4 種顏色
  6 KB (−94%)
• 
  1 位.png 2 種顏色
  4 KB (−96%)

位深度 是點陣圖影像中每個畫素、樣本或紋理元中使用的位數（包含一個或多個影像通道，典型值是 4、8、16、24、32）。在引用顏色分量時，該概念可以定義為

• 每個分量的位數 (bpc)
• 每個通道的位數 (bpc)
• 每種顏色的位數 (bpc)
• 每個畫素分量的位數 (bpp)
• 每個顏色通道的位數 (bpc)
• 每個樣本的位數 (bps)

現代標準傾向於使用每個分量的位數，但歷史上低深度系統更常使用每個畫素的位數。

顏色位深度

• 8 位顏色 = 1 位元組
  • 灰度影像
  • 帶調色盤的顏色影像 = 8 位 RGB (VGA 顏色)
• RGB565 (16 位顏色 = 2 位元組) 高色。在這裡，紅色和藍色用 5 位編碼，綠色用 6 位編碼。
• RGB888 (24 位顏色 = 3 位元組) 真彩色
• RGBA (32 位顏色 = 4 位元組)

影像檔案型別按顏色深度分類

• 對於 png，顏色深度可以從每個畫素 1 位到 64 位不等

數字型別、範圍和精度

• 整數
  • 十進位制
  • 十六進位制
• 實數

RapidTables 中的示例：

• 白色 RGB 程式碼 = (255,255,255) = 255*65536+255*256+255 = #FFFFFF
• 藍色 RGB 程式碼 = (0,0,255) = 0*65536+0*256+255 = #0000FF

GIMP 中的精度：

• 整數精度選項
  • 8 位整數
  • 16 位整數
  • 32 位整數
• 浮點精度選項
  • 16 位浮點數
  • 32 位浮點數

顏色配置檔案

• ICC 規範

ICC

• 一個 3x3 矩陣
• 每個顏色通道的一維色調曲線
• 一個三維查詢表 (LUT)
• 每個通道的第二個 1D 色調曲線

iccmax

• DemoIccMAX = iccMAX 顏色配置檔案的演示實現

顏色空間

• 顏色空間
  • 顏色空間中的離散樣本
  • CMS = 顏色匹配系統 = spot 色彩系統的分類中的行業標準
  • 製造商 及其顏色圖表

列表

• CMY
• CMYK
• HSL
  • HSLuv = 是 HSL 的一種人性化替代方案
• HSB
• HSV
• LAB
• LCH(uv)
• LCH(OK)
• LUV
• RGB
• XYZ
• YXY

型別

• 中間色域，例如 L*A*B*，更準確地保留顏色。從一種裝置到另一種裝置的顏色轉換也可以使用 Lab 作為中間步驟
• 配置檔案連線空間 (PCS)，例如 CIELAB 或 CIEXYZ
• 工作色域，例如 sRGB、Adobe RGB 或 ProPhoto 是有助於獲得良好編輯結果的色域。例如，具有相同 R、G、B 值的畫素應該顯示為中性。使用較大的（色域）工作空間會導致色帶化，而使用較小的工作空間會導致裁剪。
• 線性色域，它與自然更接近，並且使計算更物理地準確
• 顯示色域（顯示器、投影儀、電視、網路）
• 影像色域
  • PNG 或 JPEG 檔案通常會以適合顯示的色域儲存顏色，而不是線性空間。當它們用作渲染中的紋理時，需要先將其轉換為線性，然後在將渲染儲存到網路以供顯示時，也需要將其轉換為顯示空間。
  • 對於生產中的中間檔案，建議使用 OpenEXR 檔案。這些檔案始終以場景線性色域儲存，沒有任何資料丟失。這使得它們適合儲存可以稍後進行合成、顏色分級並轉換為不同輸出格式的渲染。
• 均勻色域 (UCSs) 構建為使得色域中任何位置的相同幾何距離反映相同量的感知顏色差異。已經進行過許多構建這種色域的嘗試。由於人眼有三個組成部分，因此該空間必然是 3D 的；它通常被分配為其中一個亮度，另外兩個是色度。均勻色域對於各種任務很有用。例如，它可用於計算顏色差異或以視覺上和諧的方式選擇顏色。示例：CIELAB、Nayatani 等人模型、Hunt 模型、RLAB、LLAB、CIECAM97s、IPT、ICtCp、CIECAM02、iCAM06、CAM16、OKLab
• CSS 預定義色域：CSS 提供了幾個預定義色域，包括
  • display-p3，這是當前寬色域顯示器常見的寬色域空間
  • prophoto-rgb，廣泛用於攝影師
  • rec2020，這是一個廣播行業標準，超寬色域空間，能夠代表幾乎所有可見的現實世界顏色

用分光光度計測量的葉片顏色為

• rgb(41.587%, 50.3670%, 36.664%)
• lch(51.2345% 21.2 130)
• lab(51.2345% -13.6271 16.2401)
• sRGB ( 0.41587 , 0.503670 , 0.36664)
• display-p3 ( 0.43313, 0.50108, 0.37950 )
• a98-rgb (0.44091, 0.49971, 0.37408)
• prophoto-rgb ( 0.36589, 0.41717, 0.31333 )
• rec2020( 0.42210, 0.47580, 0.35605 )

色域的屬性

• 感知均勻性：座標的相同數值變化產生相同的感知顏色差異

按感知均勻性分類

• 感知均勻 = 座標的相同數值變化產生相同的感知顏色差異
  • LCH（和 Lab）
    • OKLab
  • HSLuv
  • CIELUV，一種基於人類實驗旨在實現感知均勻性的色域。
• 大致感知均勻：sRGB（應用伽馬後）

按精度分類

• 8 位 sRGB 色域
• 10 位
• 32 位線性色域

為什麼我們需要感知均勻色域？

• 感知均勻色域使我們能夠將程式碼中的數字與觀眾感知到的視覺效果對齊

CIE XYZ

CIE XYZ。它的設計方式是其 Y 分量表示顏色的亮度。

RGB

型別

• RGB（線性，未校正）
• 伽馬校正色域 = 非線性
  • sRGB：（非線性，網際網路的標準預設色域)
    • sRGB 線性空間與 sRGB 相同，只是傳遞函式為線性光（沒有伽馬編碼）
  • Adobe RGB
  • DCI P3
    • Display P3（寬色域）

sRGB 和線性 RGB 之間的關係

• 是透過將線性畫素的每個分量提高到 1/2.2 的冪來獲得 sRGB 畫素。透過應用伽馬，sRGB 大致感知均勻。
• RGB=>sRGB 變換近似為：$V_{sRGB}=V_{RGB}^{1/2.2}$

HCV

• HSV 空間並不被認為是真正等距的。

HCL

• HCL 事實上只是 CIE Lab* 的圓柱形變換。

HSL 和 HSV

• HSL（色調、飽和度、亮度）和 HSV（色調、飽和度、值；也稱為 HSB，色調、飽和度、亮度）是 RGB 顏色模型的替代表示。
  • HSLuv = 人性化的 HSL

CIE LUV

• CIE 1976 L*、u*、v* 色域，通常簡稱為 CIELUV，是國際照明委員會 (CIE) 於 1976 年採用的一種色域，它是一種對 1931 年 CIE XYZ 色域的簡單計算變換，但嘗試實現感知均勻性

LAB

• CIELAB = CIE L*AB
• OKLAB = 用於影像處理的感知色域。CSS 中用於混合（和漸變）的預設色域是 oklab
• Hunter LAB

工具

• Olivier Vicario：Perceptual-ColorPicker 用於 Processing3

OKLAB

• CSS 中用於混合（和漸變）的預設色域是 oklab

Oklab 中的顏色用三個 Lab 座標表示：

• L – 感知亮度（[0,1] 範圍內的無量綱數字）
• a – 是綠色（負值）和紅色（正值）之間的數值
• b – 是藍色（負值）和黃色（正值）之間的數值

它的對應極座標形式稱為 Oklch。

標準座標也可以轉換為極座標形式 (Lch)，座標為

• L = 亮度
• c = 色度
• h = 色調

$C={\sqrt {a^{2}+b^{2}}}$

$h^{\circ }={\text{atan2}}(b,a)$

反向

$a=C\cos(h^{\circ })$

$b=C\sin(h^{\circ })$

另見

• 從線性 sRGB 轉換為 Oklab

CIELAB 顏色空間是

• 一個與裝置無關的
• "標準觀察者"模型
• 並非真正感知均勻

顏色分類

• 維基百科中的網路安全顏色
• 與裝置無關的顏色：CIE Lab 和 LCH、Oklab 和 Oklch
• CSS 顏色是
  • 有效或無效
  • 在色域內或色域外：顏色可能是有效的顏色，但仍可能超出輸出裝置（螢幕、投影儀或印表機）所能產生的顏色範圍，或超出給定顏色模型（例如 HSL 或 HWB）所能表示的顏色範圍
• 維基百科中的假彩色
• 維基百科中的資料視覺化中的顏色編碼
• 光譜色：彩虹是白光分解成所有光譜色的過程。
• 超光譜色
  • 灰度（無彩色）顏色，例如 白色、灰色和黑色。任何缺乏強烈色度內容的顏色都被認為是不飽和的、無彩色的或接近中性的。純無彩色包括黑色、白色、所有灰色和米色；接近中性色包括棕色、褐色、粉色和深色。接近中性色可以是任何色調或亮度。

中性色是透過將純色與白色、黑色或灰色混合，或者透過混合兩種互補色來獲得的。在色彩理論中，中性色是可以被相鄰更飽和的顏色輕鬆修改的顏色，它們似乎呈現出與飽和色互補的色調。在一張鮮紅色的沙發旁邊，灰色的牆壁會呈現出明顯的綠色。

黑色和白色長期以來一直被認為可以與幾乎任何其他顏色很好地搭配；黑色會降低與之搭配的顏色表面的飽和度或亮度，而白色則可以平等地顯示出所有色調

• • 任何透過混合灰度顏色和其他顏色（無論是光譜色還是非光譜色）獲得的顏色，例如粉色（紅色和白色的混合物），或棕色（橙色和黑色或灰色的混合物）。
  • 紫色-紅色顏色，在色彩理論中包括紫紅色系顏色（例如，大約是洋紅色和玫瑰色），以及其他紫紅色變體。
  • 不可能的顏色，在正常的光照下無法看到，例如過飽和的顏色或看起來比白色更亮的顏色。
  • 金屬色，透過效果反射光線。

每個有效的顏色要麼在特定輸出裝置（螢幕或印表機）或顏色空間的色域內，要麼在色域外。

CMS

專色分類導致數千種離散顏色被賦予唯一的名稱或編號。在專色系統分類中，有幾個行業標準，例如

• 潘通，是美國和歐洲占主導地位的專色印刷系統。
• 東洋，是日本常見的專色系統。
• DIC 顏色系統指南，是日本另一種常見的專色系統——它基於孟塞爾色彩理論。
• ANPA，是美國報業協會為報紙上的專色使用而指定的 300 種顏色的調色盤。
• GCMI，是玻璃包裝研究所（以前稱為玻璃容器製造商協會，因此縮寫為 GCMI）制定的包裝印刷中使用的顏色標準。
• HKS 是一種包含 120 種專色和 3250 種用於塗布和未塗布紙張的色調的顏色系統。HKS 是三個德國顏色製造商的縮寫：Hostmann-Steinberg Druckfarben、Kast + Ehinger Druckfarben 和 H. Schmincke & Co。
• RAL 是一種在歐洲使用的顏色匹配系統。所謂的 RAL CLASSIC 系統主要用於油漆和粉末塗料。

因為每個顏色系統都是從頭開始建立自己的顏色，所以一個系統中的專色可能無法在另一個系統的庫中找到。

• AS2700 = 澳大利亞標準顏色 (AS 2700)

顏色體積

sRGB 色域投影到 CIExyY 顏色空間

顏色體積是所有可用顏色在所有可用色調、飽和度和亮度下的集合。 它是二維顏色空間或二維顏色色域（表示色度）與動態範圍相結合的結果。

該術語已被用來描述HDR 比SDR 更高的顏色體積（即峰值亮度至少為 1000 cd/m²，比 SDR 的 100 cd/m² 限制高，並且更廣的色域比w:Rec. 709 / w:sRGB）。

顏色體積

• SDR 顏色體積 = 200 cd/m2
• HLG 顏色體積 = 1 000 cd/m2
• PQ 顏色體積 = 10 000 cd/m2

色域

• 
  P3、Rec2020、sRGB 和其他色域
• 
  CRT 監視器的 sRGB 色域
• 
  RGB 和 CMYK 色域之間的區別。

在顏色再現中，包括計算機圖形和攝影，色域是指顏色的特定完整子集。最常見的用法是指在給定情況下能夠準確表示的顏色的子集，例如在給定顏色空間內或由特定輸出裝置（例如顯示器）表示的子集。

RGB 和 CMYK 色域之間的區別：CMYK 色域比 RGB 色域小得多，因此 CMYK 顏色看起來很暗淡。

如果要在 CMYK 裝置（膠印機或噴墨印表機）上列印影像，兩側看起來可能更相似，因為青色、黃色、洋紅色和黑色的組合無法再現計算機顯示器顯示的顏色範圍（色域）。對於從事印刷生產的人來說，這是一個持續存在的問題。客戶在電腦上製作鮮豔多彩的影像，卻失望地發現印刷出來後顏色變得暗淡。（照片處理是一個例外。在照片處理中，如快照或 8x10 光面照片，大部分 RGB 色域都會被再現。）

可以透過檢視不同顏色空間可以表達的顏色體積（以立方 Lab 單位計）來比較它們的顏色範圍。下表考察了 CSS 中可用的預定義顏色空間。

顯示

• 窄色域顯示（sRGB 色域）
• 寬色域顯示（超過 sRGB）
  • 色域 of Display P3 色域：Display-P3 色域包含 sRGB 中沒有的鮮豔色彩。
  • 色域 of Rec.2020 色域（罕見）
  • lab lch 色域的色域

顏色空間體積（以百萬 Lab 單位計）

• sRGB = 0.820
• display-p3 = 1.233
• a98-rgb 1.310
• prophoto-rgb 2.896
• rec2020 2.042

連結

• 可汗學院：皮克斯，顏色空間

顏色運算子

簡單的顏色運算子，一種可以根據單個輸入變數 f(x) 進行引數化的分析顏色運算子

• 亮度
• 伽馬
• 對比度
• 色平衡

動態範圍

動態範圍

伽馬校正

• 伽馬校正縮小
• fractalforums.org：伽馬校正和縮放影像的位置
• 傳遞函式，也稱為色調響應曲線（TRC）或伽馬函式

伽馬值

• 真實世界 = 1.0
• 浮點影像（HDRI）= 1.0
• 整數（具有 sRGB 的 SDRI）影像 = 2.2

傳遞函式

影像中的傳遞函式 T

• 將影像亮度與影像樣本相關聯的函式

 $T:scalarvalue\to colorvalue$

示例：

• gray(x) 返回灰色陰影。引數 x 應該在 0-1 範圍內。如果 x=0，則返回黑色；如果 x=1，則返回白色。
• rgb(r,g,b) 返回具有指定 RGB 成分的顏色，這些成分應該在 0-1 範圍內。
• cmyk(c,m,y,k) 返回具有指定 CMYK 成分的顏色，這些成分應該在 0-1 範圍內。
• hsb(h,s,b) 返回具有指定色相-飽和度-亮度顏色空間座標的顏色，這些座標應該在 0-1 範圍內。
• hsl(h,s,l)

標準化 = 重新縮放到標準範圍

 $scalarvalue{\xrightarrow {normalize}}[0,1]{\xrightarrow {transferfunction}}colorvalue$

型別

• ParaView 中的顏色和不透明度分離傳遞函式
• 多維傳遞函式
• "傳遞函式技術是一種體積射線投射和渲染技術，它在不同強度值範圍內分配不同的顏色和不同的不透明度/透明度值。這是使用基於直方圖的函式（“傳遞函式”）完成的。傳遞函式包含多個控制點，每個控制點對應一個強度值，並且具有 RGB 顏色和不透明度/透明度值。控制點的強度值以其顏色和不透明度/透明度值顯示，兩個控制點之間的強度值以兩個控制點的插值顏色和插值不透明度/透明度值顯示。使用傳遞函式，人體不同部位以不同的顏色和不同的不透明度/透明度值顯示。" - 來自 Sante DICOM Viewer 3D Pro
• HDR 傳遞函式

色調對映

• "將一幀 HDR 資料（真實或合成）壓縮到顯示器可以顯示的範圍內的過程稱為色調對映。"
• "色調對映是將浮點顏色值轉換為預期 [0.0, 1.0] 範圍（稱為低動態範圍）的過程，而不會丟失太多細節，通常伴隨著特定的風格化顏色平衡。"

 $HDR\xrightarrow {tone\ mapping} LDR$

• tonemapper = 用於探索和應用各種色調對映運算子的工具，由 Tizian Zeltner 建立
• 色調對映運算子 由 romainguy 建立
• snibgo 的 ImageMagick 頁面：HDRI 傳遞函式
• "雖然有很多不同的方法可以實現它，但根據渲染的內容和方式，某些方法的效果會比其他方法更好。" - FractalLandscaper
• "如果您渲染的是使用隨機取樣的東西（例如 Buddhabrot），那麼可以使用具有不同種子和/或略微不同的取樣偏移的多個影像的中值堆疊來生成更平滑的最終影像。" - FractalLandscaper

關於範圍的型別

• 全域性
• 區域性

關於函式型別的傳遞函式型別:

• 用於原始影像格式的線性函式，請注意，一些 OETF 和 EOTF 具有初始線性部分，之後是非線性部分（例如 sRGB 和 Rec.70）
  • 恆等傳遞：輸出 = 輸入
• 伽馬函式
• 對數函式
• HDR：用於高動態範圍影像（HDR、HDRI）的傳遞函式
  • 恆等傳遞：輸出 = 輸入
  • 歸一化函式，線性壓縮，“-autolevel”函式：對於所有輸入，輸出都在 [0,1] 範圍內。除以最大值，則最大輸入將轉換為 1.0。
  • 壓縮高光，對於非負輸入值，輸出值在 [0,1] 範圍內。負輸入產生負輸出。在 (0,0) 處的梯度為 1.0。在輸入=1 處，輸出=0.5。對於較大的輸入，輸出接近 1.0，梯度接近零
  • S 形曲線：壓縮高光和陰影
  • 壓縮陰影
  • 混合對數伽馬 (HLG) 傳遞函式（混合對數伽馬 HDR = HLG HDR）
  • 感知量化器 (PQ) 傳遞函式

Image magic 程式碼

convert <SomeDirectory>\*.png -evaluate-sequence median MEDIAN.png

顏色值

• 顏色術語
• Gnuplot 中的顏色規範
• colorhexa：顏色百科全書：資訊和轉換
• html 顏色程式碼
• 大衛·布里格斯提供的顏色規範
• 比利·比格斯提供的計算中的顏色差異編碼（未完成）
• 來自 colorjs 庫的顏色轉換

格式

可以使用以下格式之一指定顏色

• 空間中的點 - 直接顏色
  • 十六進位制 RGB
  • 十六進位制 RGBA
  • rgb
  • rgba
  • hsl
  • hsla
  • cmyk
• 名稱（字串）
• 索引顏色：來自調色盤的索引號

Alpha 顏色通道

• 在 OpenGl 中，alpha 反直覺地表示不透明度，因此 alpha = 1 表示完全不透明，而 alpha = 0 表示完全透明。

在 PIL（Python 影像庫）中，畫素顏色格式由模式定義

• 1（1 位畫素，黑白，每個位元組儲存一個畫素）
• L（8 位畫素，黑白）
• P（8 位畫素，使用調色盤對映到任何其他模式）
• RGB（3x8 位畫素，真彩色）
• RGBA（4x8 位畫素，帶有透明度蒙版的真彩色）
• CMYK（4x8 位畫素，顏色分離）
• YCbCr（3x8 位畫素，彩色影片格式）
• I（32 位有符號整數畫素）
• F（32 位浮點畫素）
• LA（帶 alpha 的 L）
• RGBX（帶有填充的真彩色）
• RGBa（帶有預乘 alpha 的真彩色）。

數字型別（精度）

• 整數（自然數）
  • 無符號字元 = 範圍從 0 到 255，提供 256 個數字
  • 整數
• 實數
  • 浮點精度，例如：1.0f
  • 雙精度
• 十六進位制顏色程式碼（HEX 顏色表示法）
  • 十六進位制：sRGB 的字串表示

示例

• 在 OpenGl 中，每個顏色元件的值介於 0.0 和 1.0 之間，即在 [0,1] 範圍內。這裡 1.0 表示儘可能多的顏色，而 0.0 表示沒有顏色。

glColor3f(0.5f, 0.0f, 1.0f); // (0.5, 0, 1) is half red and full blue, giving dark purple.
glm::vec3 coral(1.0f, 0.5f, 0.31f);  // coral color definition in glm library and C++

GIMP 中的示例

• GIMP 中的灰度精度
  • 在整數精度下
    • 8 位整數灰度影像提供從 0（黑色）到 255（白色）的 255 個可用色調步驟。
    • 16 位整數灰度影像提供從 0（黑色）到 65535（白色）的 65535 個可用色調步驟。
    • 理論上，32 位整數灰度影像將提供從 0（黑色）到 4294967295（白色）的 4294967295 個色調步驟。但是，由於高位深度 GIMP 2.10 在 32 位浮點精度下進行所有內部處理，因此實際的步驟數不會超過 32 位浮點影像中可用的色調步驟數。
  • 在浮點精度下：灰度影像中可用色調步驟數取決於指定的位深度（8 位、16 位或 32 位）

另見

• computergraphics SE 問題：half-float、double 等多少精度對於顏色類足夠？rq=1

Alpha、合成、透明度和圖層

Alpha

• 是指顏色的不透明度或透明度
• 也會影響對比度
• 以介於 0（完全透明）和 1（完全不透明）之間的數字表示
• 降低元素的 alpha 值會降低其對比度，因為您允許底層顏色透過來

• 
  這個 顏色光譜 影像的 alpha 通道在其底部逐漸降至零，在那裡它與背景色混合

圖層

• Javier Barrallo 和 Santiago Sanchez 的分形和多層著色演算法

css 語法

Css 程式碼	描述	預覽影像
oklab(0.5 -0.3 -0.4);	藍色
oklab(0.7 -0.3 -0.4);	淺藍色
oklab(100% 0.4 0.4);	紅色
oklab(100% 0.2 0.4);	紅色-a
color(display-p3 1 0 0.331);	display-p3 中的鮮豔粉色。color() 函式允許在特定顏色空間中指定顏色

這種 藍色陰影 通常可以透過網頁樣式中的三種不同的方式定義：

• rgb(97 97 255)：形成顏色的紅色、綠色和藍色的量分別表示為介於 0 和 255 之間的數字。
• #6161FF：這是一種“十六進位制”格式，其中紅色/綠色/藍色值表示為六個字母或數字的組合。通常稱為“十六進位制”，這在網頁中是一種非常常見的格式。
• hsl(240 100% 69%)：色相、飽和度和亮度更接近人們感知顏色的方式。改變顏色的“亮度”將改變其與另一種顏色的對比度。

Css 程式碼	描述	預覽影像
rgb(97 97 255)	rgb
#6161FF;	十六進位制值
hsl(240 100% 69%)	hsl

青檸色

• color(a98-rgb 0.565 1 0.234)
• color(a98rgb-linear 0.285 1 0.041)
• color(acescc 0.466 0.548 0.373)
• color(acescg 0.34 0.916 0.11)
• hsl(120 100% 50%)
• color(hsv 120 100 100)
• hwb(120 0% 0%)
• color(ictcp 0.54 -0.28 -0.05)
• color(jzczhz 0.177 0.161 132.5)
• color(jzazbz 0.177 -0.11 0.119)
• lch(87.82 113.3 134.4)
• lab(87.82 -79.3 80.99)
• lab-d65(87.74 -86.2 83.19)
• oklch(0.866 0.295 142.5)
• oklab(86.64% -0.23 0.179)
• color(display-p3 0.458 0.985 0.298)
• color(p3-linear 0.178 0.967 0.072)
• color(prophoto-rgb 0.54 0.928 0.305)
• color(prophoto-linear 0.33 0.873 0.118)
• color(rec2020 0.568 0.959 0.269)
• color(rec2020-linear 0.329 0.92 0.088)
• color(rec2100-hlg 0.511 0.733 0.264)
• color(rec2100-pq 0.468 0.572 0.347)
• color(xyz-abs-d65 72.59 145.2 24.2)
• color(xyz-d65 0.358 0.715 0.119)
• rgb(0% 100% 0%)
• color(srgb-linear 0 1 0)

另見

• LeaVerou：color.js（CSS 顏色規範編輯者的顏色轉換和操作庫） 和 網站

顏色選擇器

• 來自 colorjs 庫的顏色選擇器

顏色對比度

視覺感知中的對比度是同時或連續看到的一個或多個區域的視覺外觀上的差異（因此

• 亮度對比度，
• 亮度對比度，
• 顏色對比度，
• 同時對比度
• 連續對比度
• 等等。

物理學中的對比度是一個旨在與感知亮度對比度相關的量，通常由許多公式之一定義（見下文），這些公式涉及例如所考慮刺激的亮度。

對比度也可能是由於色度差異導致的，色度差異由比色特性指定（例如，顏色差 ΔE CIE 1976 UCS）。

影像的最大對比度是對比度比或動態範圍。

型別

• 簡單對比度
• Web 內容無障礙指南 (WCAG) 這裡對比度是兩種顏色之間感知的“亮度”或亮度差異的度量。這種亮度差異表示為一個比值，範圍從 1:1（例如，白色到白色）到 21:1（例如，黑色到白色）。在白色背景上，純紅色（#FF0000）的比值為 4:1，純綠色（#00FF00）的比值非常低，為 1.4:1，純藍色（#000FF）的對比度比值為 8.6:1。
• 可訪問感知對比度演算法 (APCA)
• 韋伯對比度，也常簡稱為亮度對比度
• Delta Phi
• L 星
• 米歇爾森對比度，也稱為調製或峰峰對比度

維基百科

• Display_contrast
• 顏色對比度
• 亮度
  • 亮度是主觀印象對客觀亮度的術語

程式

• leonardo：js 包，根據所需的對比度比生成顏色

顏色質量

• 顏色保真度指數
• 顯色指數
• 顏色質量等級
• 美國電影藝術與科學學院光譜相似性指數 (SSI)
• css 顏色顯示質量：color-gamut 特性。值：srgb | p3 | rec2020

參考資料

• 數字色彩指南
• John the Math Guy。應用數學和色彩科學，並佐以大量的幽默 John Seymour