顏色選擇器以 OKLCH 運作，這是現代 CSS 中貼近人眼感知的色彩空間。在選色區域中，彩度由左至右從灰色增加到螢幕在該亮度下能顯示的最大值，因此每一點都是可用的顏色；轉動色相時，控點也會留在原處。
輸入欄位接受任何 CSS 顏色，包括顏色名稱；格式按鈕會把值寫成 hex、rgb()、hsl()、oklch() 或 color(display-p3)。超出某種格式色域的顏色，會依 CSS 的方式對應到色域內，並保留亮度和色相。
加上 swatches 可提供候選顏色，加上 contrastWith 則能依 WCAG 2 的計算方式，檢查顏色與背景的對比度。瀏覽器支援滴管時，還會有一個按鈕可以從螢幕上取色。
品牌色
具名的色票，以及白色文字在該顏色上的對比度：選擇淺色時，AA 就會不合格。
Contrast 6.28:1 AA passes AAA fails
#4f46e5
廣色域
gamut="p3" 會以 Display P3 色彩填滿選色區域，並用虛線標出 sRGB 的邊界。值仍以 oklch() 表示。
放在 Popover 中
顯示目前顏色的按鈕會在 Popover 中開啟選擇器。