Baking a color palette generator
I have started building a UI framework and I was unimpressed with the idea of manually building out a color palette, so with the help of a few articles and a couple of hours of work I have baked a color palette generator in Vue.
I was really inspired by this brilliant article by Jeeyoung Jung. I have taken his idea of using circular dependencies between saturation and luminance, and put together an editable parabolic formula, which allows you customize all colors in a single go. As an added bonus it spits out a list of variables you can use in CSS, SCSS and JSON.
Have fun and let me know what you think.
The tool is deployed on Github Pages for your convenience. The repo is open for pull requests and forks.
Update Apr 8: Swatches now provide information about contrast ratio, which can help you build more accessible palettes, as per WCAG 2.0 spec.
Update Apr 10: I have been continuing work on this tool, as I found it quite useful for my own work. You can now preview the graph of the formula being used with any given hue, as well as see an entire palette summary with color contrast accessibility. There are now more controls that allow you to bulk modify saturation and luminance of a hue palette.
