在 Sass 的官方文檔中，列出了 Sass 的顏色函數清單，從大的方面主要分為 RGB , HSL 和 Opacity 三大函數，當然其還包括一些其他的顏色函數，比如說 adjust-color 和 change-color 等。在這章節中，將主要和大家一起探討 Sass 顏色函數中常見的 RGB、HSL 和 Opacity 函數。

1、RGB顏色函數

RGB 顏色只是顏色中的一種表達式，其中 R 是 red 表示紅色，G 是 green 表示綠色而 B 是 blue 表示藍色。在 Sass 中為 RGB 顏色提供六種函數：

• rgb($red,$green,$blue)：根據紅、綠、藍三個值創建一個顏色；
• rgba($red,$green,$blue,$alpha)：根據紅、綠、藍和透明度值創建一個顏色；
• red($color)：從一個顏色中獲取其中紅色值；
• green($color)：從一個顏色中獲取其中綠色值；
• blue($color)：從一個顏色中獲取其中藍色值；
• mix($color-1,$color-2,[$weight])：把兩種顏色混合在一起。

僅從概念上，或許大家沒有太多的概念，我們通過下面的命令來做一個簡單的測試：

sass -i

在命令終端開啟這個命令，相當于開啟 Sass 的函數計算。

接下來，分別在終端使用 RGB 函數來進行計算，看其最終結果：

$ sass -i
>> rgb(200,40,88) //根據r:200,g:40,b:88計算出一個十六進制顏色值
#c82858
>> rgba(#c82858,.65) //根據#c82858的65%透明度計算出一個rgba顏色值
rgba(200, 40, 88, 0.65)
>> red(#c82858) //從#c82858顏色值中得到紅色值 200
200
>> green(#c82858) //從#c82858顏色值中得到綠色值 40
40
>> blue(#c82858) //從#c82858顏色值中得到藍色值 88
88
>> mix(#c82858,rgba(200,40,80,.65),.3) //把#c82858和rgba(200,40,88,.65) 兩顏色按比例混合得到一個新顏色
rgba(200, 40, 80, 0.65105)

從上面的簡單運算結果可以很清晰的知道。在 RGB 顏色函數中，在實際中常用的主要是 rgba() 和 mix() 兩個函數，而 rgb() 函數只能快速的將一個 rgb 顏色轉換成十六進制顏色表達，red()、green() 和 blue() 函數，只能取得某一顏色的一個值，對于顏色上使用并無太大作用（或許他的好處，我還沒有理解過來）。接下來，主要來實戰一下 rgba() 和 mix() 函數在實際中的運用。