ACCESSIBLE PALETTE

HSL is an alternative representation of the RGB color model. It's the most common way to specify color in design tools, but it has an inherent fault - Lightness and Saturation don't reflect human perception. Compare blue and green - while both have a Lightness of 50, blue looks much darker... Unlike the RGB, the CIELAB color model is designed to approximate human vision, and L component closely matches the human perception of lightness. It may be tricky to use it directly (just as RGB), but there are alternative representations like LCh (C is for Chroma) that work similarly to HSL... In this color model, colors with the same specified Lightness have the same perceived lightness and WCAG contrast ratio. The same blue and green with Lightness of 50 look consistent and have a contrast ratio of 4.5:1 against white, meeting WCAG requirement.