編輯中，僅請見諒 m(_ _)m

主要是看 W3C 的顏色草稿 來筆記的~

純色

目前表示顏色的方式大概有幾個方法：顏色的名字 / rgb / hex / hsl

顏色的名字是一些瀏覽器預設的顏色關鍵字，例如 black / whitesmoke / skyblue 等等。

白色：white
巧克力色：chocolate

rgb 則是分別用 0-255 的數值，來表示 紅 / 綠 / 藍 的程度

像是白色是 rgb(255, 255, 255)、黑色是 rgb(0, 0, 0)

hex 跟 rgb 很類似，只是換成使用 16 進位 ( 0 到 f ) 表示

例如 255 = 15*(16^1) + 15*(16^0)，在 16 進位下就是 ff
因此 white = rgb(255, 255, 255) = #ffffff

另外如果 r / g / b 的兩個位數數字都相同的話，可以簡寫成一個

white = #ffffff = #fff
red = #ff0000 = f00

hsl 則分別是顏色的色調、飽和度及亮度，
其中色調是以 deg 為單位、飽和度跟亮度都是百分比的形式。

這張圖就可以很完整解釋了：

( from: CSS3 – Design with Color Control and Opacity :: christinadescalzo )
0 度或 360 度時是紅色 / 120 是綠色 / 240 是藍色 / ...

加上透明度

設定完顏色後，還可以加上 alpha 來設定透明度：rgb => rgba / hsl => hsla

像是需要一個半透明遮罩時，我們就可以透過設定 background: rgba(0, 0, 0, .2) 來完成。
hsla 用法也以此類推~

hwb

三個英文分別代表 hue / whiteness / blackness
語法是 ( 第四個選擇性的值是 alpha )

.somthing {
    color: hwb( <hue> <percentage> <percentage>)
    color: hwb( <hue> <percentage> <percentage> / <alpha-value> )
}

( from: https://drafts.csswg.org/css-color/#hwb-examples )

我是這樣理解的：
whiteness 跟 blackness 的比例會決定一種灰色。
而 (whiteness + blackness) / 2 則會決定 hue 的顏色灰化 (?) 的程度。

lab & lch

本來不是很懂，看了 Lab 色彩空間 :: wikipedia 後... 就更不懂了 Orz
目前還是有個概念而已，之後還需要了解一下 CIE 色彩空間是什麼。

總之這兩個顏色設定的方法都是以 CIE 色彩空間 為基礎的，被設計用來接近人類視覺的模式 ( rgb / hsl 則是以物理世界的顏色為基礎 )，相對起來也比較有視覺均勻性。

視覺均勻性 ( perceptually uniform ) 是指 "值的變化度就跟看起來的變化度一樣"
例如當值 "從 0 變成 10"，感受到的變化度跟 "從 10 變成 20" 一樣~

lab

目前只大概有個初步認知而已 (O艸 Q )

( from: RGB與CIELAB色彩空間轉換 :: cg2010studio )
l 是明亮度，允許範圍一般是 0 ~ 100，但在某些系統上最亮可以到 400
a 跟 b 則是描述顏色的兩個軸 ( 理論上是兩個值都沒有限制，但人眼可見的範圍是有限的 )

lch

gray

color

color-adjust

其他在 CSS4 草案中的新東西