SWEET の機能追加のために必要になったので調べた。

1. 親の色を使う

property の Value を inherit にすれば親要素の色を用いることができる。デフォルト値。

2. 名前で指定

いくつか色の名前が定められており、これらを指定することで簡単に色を指定できる。red や skyblue など。一覧：https://www.w3.org/TR/css-color-3/#svg-color

3. #RRGGBB で指定する

これもよくある手段。赤の強さ、緑の強さ、青の強さを 16 進数 (00～FF) で指定する。#FFFFFF だと白になる。

4. #RGB で指定する

3. より単純な方法。赤の強さ、緑の強さ、青の強さを 16 進数 (0～F) で指定する。#FFF だと白になる。

5. rgb(r, g, b) の数字で指定する

3. に似たような方法。 rgb(赤の強さ, 緑の強さ, 青の強さ) を10進数 (0～255) で指定する。rgb(255, 255, 255) だと白になる。

6. rgb(r, g, b) の割合で指定する

5. に似たような方法。 rgb(赤の強さ, 緑の強さ, 青の強さ) を割合 (0%～100%) で指定する。0%なら0だし、100%なら255。rgb(100%, 100%, 100%) だと白になる。

7. HSL (色相 / 彩度 / 輝度) で指定する

CSS3 で追加された指定方法。 hsl(色相, 彩度, 輝度) を指定する。彩度は灰色 (0%) ～ 純色 (100%) を表現し、輝度は 黒 (0%) ～ 純色 (50%) ～ 白 (100%) を表現する。色相が純色がどんな色なのかを色相環の角度で表現する。配色を考えるのが面倒ならhsl()を使おう - Qiita の解説や図が分かりやすい。hsl(90, 100%, 50%) だと yellow になる。

rgba で透明度を指定する

rgba(赤, 緑, 青, 透明度) というように上述 5, 6 の記法に追記することで透明度を加えることができる。0だと完全に透明。1だと完全に不透明。数字が大きい方が不透明になるので不透明度、という方が正しい気がする。

hsla で透明度を指定する

hsla(色相, 彩度, 輝度, 透明度) というように上述 7 の記法に追記することでも透明度を加えることができる。

公式のドキュメント

Tantek Çelik, Chris Lilley and L. David Baron. CSS Color Module Level 3. 7 June 2011. W3C Recommendation. URL: https://www.w3.org/TR/css-color-3/