With OKLCH support being now supported in all major browsers, it is time to give a chance to the new OKLCH color. If you don't know what this is, please read this wonderful article by evil martians.

It is now easier than ever to create a color palette system using just a handful of css variables. Simply set the lightness from 0 to 100%, then, set up your chroma (an average value of 0.2 works well, but you might want to lower this to 0.10 or 0.15 for softer tones, or crank it up to 0.3 or more for vivid colors), and your hue (starting with 0 being pink, then move it up to 360... being pink again. Increments between 25 and 50 work well).... and you are good to go!

Here is a simple example with APCA contrast value being written in it to assess accessibility.