所有主要引擎現在都支援新的 CSS 色彩空間和函式。瞭解如何為設計增添活力。
CSS 現在支援色域，可讓我們存取 sRGB 色域以外的顏色。也就是說，您可以使用 HD 色域的顏色，支援 HD (高畫質) 螢幕。這項支援功能提供新的函式，可讓您在網路上更有效地使用顏色。
透過 CSS 存取色彩空間
我們已經有許多函式可讓我們存取 sRGB 色域內的顏色，包括 rgb()、hsl() 和 hwb()。瀏覽器現在支援 color() 函式，這是一種標準化的方式，可存取任何 RGB 色域中的顏色。包括 sRGB、Display P3 和 Rec2020。您可以在下列 CSS 中看到一些範例：
.valid-css-color-function-colors {
--srgb: color(srgb 1 1 1);
--srgb-linear: color(srgb-linear 100% 100% 100% / 50%);
--display-p3: color(display-p3 1 1 1);
--rec2020: color(rec2020 0 0 0);
--a98-rgb: color(a98-rgb 1 1 1 / 25%);
--prophoto: color(prophoto-rgb 0% 0% 0%);
--xyz: color(xyz 1 1 1);
}
系統也支援多個函式，可使用 lch()、lab()、oklch() 和 oklab() 存取 sRGB 以外的色彩空間。
如要瞭解所有不同的色彩空間，請參閱 高解析度 CSS 色彩指南。
color-mix() 函式
除了��������色彩空間���外，所有引擎現在都支援 color-mix() 函式。這個函式可在任何色彩空間中，將一種顏色混合到另一種顏色。在下列 CSS 中，25% 的藍色會混合至 srgb 色彩空間中的白色。
.example {
background-color: color-mix(in srgb, blue 25%, white);
}
這些新函式和色彩空間可為網頁帶來鮮豔的 HD 色彩。如要尋找靈感，請先使用 gradient.style 中的 HD 漸層產生器，建立一些精美的漸層。