This is an experiment in a couple ways for me. The goal was to make scaled color palettes with a little playground to see how the current color choices work together. The challenges were for me to see what I could get away with in just Sass & to start messing with node & gulp to get the hang of this new-wave stuff :)
- HTML
- JS
- SCSS (is actually where all the generation happens for now)
- Node & Gulp to compile SCSS
- Install npm (only for compiling scss)
- npm project requires gulp, browser-sync, gulp-sass, gulp-autoprefixer (Only if you want to compile your scss that way)
- Set your colors under
// BASE COLORS HERE!in style.scss file. - Run
gulpin terminal at the project root folder! DONEZO.
- Get rid of/ rethink the circles... haha
- Click to copy color
- export colors as... ase?
- Allow tweeking of each color scale independently of others
- Allowing mixing of colors with other colors % shade wise
- URL encode master colors to easily allow changing and trying different color scales.
- Make autoprefixer work in gulpfile
- Allow dynamic creation of number of colors.
The idea started here http://codepen.io/okayjeffrey/pen/ONEOYM. Please note: This is all a little hacky & this project will be updated and refactored probably everytime I use it.