Gumagana ang color picker sa OKLCH, ang perceptual color space ng modernong CSS. Pahalang sa area, tumatakbo ang chroma mula gray hanggang sa pinakamataas na kayang ipakita ng screen sa lightness na iyon, kaya magagamit na kulay ang bawat punto, at hindi gumagalaw ang thumb habang umiikot ang hue.

Tumatanggap ang field ng kahit anong CSS color, kasama ang mga pangalan, at isinusulat ng format button ang value bilang hex, rgb(), hsl(), oklch() o color(display-p3). Ang kulay na nasa labas ng gamut ng isang format ay ipinapasok dito sa paraan ng CSS, at pinapanatili ang lightness at hue nito.

Magdagdag ng swatches na mapagpipilian, at ng contrastWith para i-check ang kulay laban sa isang background ayon sa pagsukat ng WCAG 2 sa contrast. Kapag may eyedropper ang browser, may button na pumipili ng kulay mula sa screen.

Isang brand color

Mga swatch na may pangalan, at ang contrast ng puting text sa kulay: pumili ng maliwanag, at babagsak ang AA.

Contrast 6.28:1 AA passes AAA fails
Get started

#4f46e5

Malawak na gamut

Pinupuno ng gamut="p3" ang area ng mga Display P3 color, at minamarkahan ng isang dashed line kung saan nagtatapos ang sRGB. Nananatili sa oklch() ang value.

Sa isang popover

Binubuksan ng button na nagpapakita ng kulay ang picker sa isang popover.