You can see and edit the demos online in Glitch if you do not want to run it locally:
To run locally, you first need to clone and install the project with Node.js and npm, and it will need to be a newer version like node@16
or higher. You can download Node.js and npm here.
In terminal, run the following from your desired root folder:
git clone https://github.com/mattdesl/workshop-generative-color.git
cd workshop-generative-color
npm install
Then, start the dev server:
npm run start
Open http://localhost:9966/ and start changing exercises in the sketches/ folder.
- color grab — pick colors from an image
- color swatch — a color picker tool across multiple spaces
- color-spd — make colors from spectral color distributions
- Google HSV Color Picker
- OKLCH and LCH Color Picker
- OKHSV and OKHSL Color Picker (related blog post)
- HSLuv
- 147 Named CSS Colors
- Hue Color Models
- Sorted CSS Colors
- Color Systems
- "It's Time to Learn oklch Color" by Keith J. Grant
- nice-color-palettes
- chromotome
- paper-colors
- riso-colors
- dictionary-of-colour-combinations
- color-names
All code that I have written here is licensed as MIT. Some additional notes:
- The ColorChecker data in
lib/spectra/
is from here, which does not explicitly give a license - The CIE 1931 2º Standard Observer Color Matching Functions and CIE Standard Illuminants in
lib/spectra
I believe are public domain. They are sourced from here and elsewhere. If somebody finds any specific license information please let me know. - The precomputed CIE 1931 basis BT709 spectra data in
lib/spectra
is MIT under this repository - The vendor scripts in
lib/vendor
are all pulled from MIT licensed packages. - The oklab conversion math in
lib/oklab.js
is from Björn Ottosson's repo here and is MIT licensed