I’m working on creating CSS preprocessor functions to generate different shades of colors similar to how modern design frameworks handle color variations.
I need to build automated color generation that takes a base color and creates lighter and darker versions with numeric scales like 100, 200, 300, 400, 500, 600, 700, 800, 900.
The problem is I can’t figure out what mathematical formula or percentage calculations are used to create these consistent color steps. Does anyone know the specific percentage or lightness adjustments that get applied between each numbered variation?
I’ve been searching everywhere but haven’t found clear documentation about the actual math behind these color scaling systems. Any help would be great!