Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
readme_images
.gitignore
LICENSE.md
README.md
colors.css
colors.sass
gulpfile.js
index.html
layout.css
package.json

README.md

Color Scheme Generator based on Practical Color Theory for People Who Code

This project automates the process outlined in the article above and generates HTML and CSS files that, together, show a page like this:

Color Scheme

How to use

First, you need to clone the repository:

git clone https://github.com/Domysee/ColorSchemeGenerator.git

Then you need to install the npm dependencies:

cd ColorSchemeGenerator

npm install

Note: This project assumes you have npm set up and gulp-cli installed globally. If you don't know how to do that, read A short Introduction to npm of my blogpost Learning Gulp for Website Minification.

The last step is to start the Gulp task that does the heavy lifting:

gulp compile-sass:watch

It boots up a local server and automatically opens the page in you default browser. If it does not, it is available under http://localhost:3000/.
The task watches all changes to colors.sass, and immediately updates the page when something changd. This is the resulting behavior:

Automatic Color Scheme Updates

I don't like immediate Changes

If you don't like this behavior, and rather update manually, you can do this by not running

gulp compile-sass:watch

and instead recompile the SASS using

gulp compile-sass

every time you want the color scheme updated. Keep in mind that after doing this, you have to refresh the page to see the updated page.