paints
v0.0.0Paints
A flexible lightweight Javascript color theme provider, designed with canvas in mind. Pick from a large number of color themes, generate as many colours as you need, then start using them in your project. Check out our examples for some ideas.
===
Installation
Browser
If you want to use palette in your browser, then simply grab the production or development scripts, embed them in your project and you are ready to use palette.
var icey = paints('ice', 20);
Node
Fire up npm and run npm install palettejs
then require it and get started.
var paints = require('paints');
var icey = paints('ice', 30);
Getting started
Palette is a breeze to use
paints('reds', 10);
This call would return an array of 10 hex colors from the reds theme. Check out themes for a complete list of themes.
Themes
- reds
- greens
- blues
- greyscale
- ice
- fire
- earth
- pastel
- zurg
- monaLisa
- sea
- pond
- stars
- night
- dream
- avocado
- morgul
Contributing
If you want to add a color scheme, clone this repo add your theme to src/themes.js, credit yourself with a comment. Run node build.js
to update the README.md then send a pull request.
How to develop a theme
Open a look in themes.js
The basic template for a theme is as follows.
'my-theme': function(x) {
var r = 100;
var g = x * 100;
var b = 255;
return [r, g, b];
}
Your theme function must return an RGB color in the form of an array of length 3 for some value of x where 0 < x < 1
. If you want to use HSL instead of RGB, pass your RGB values to the hslToRgb
method like so:
'my-theme': function(x) {
var h = 100;
var s = x * 100;
var l = 255;
return hslToRgb(r, g, b);
}
Source Code
github.com/code-curve/palett...Metadata
- BSD-2-Clause
- Whatever
- Dan Prince
- released 12/6/2013