Regenbogen

A functional gradient.

Create a function that will return a color when passed a number. Colors can be passed as css color names, css color strings, arrays and objects. The returned function is perfectly suited to be used in Array.prototype.map.

If you don't pass an array of color stops, regenbogen will calculate the stops on its first use. If you dont use it in Array.prototype.map, it won't be able to calculate it, though, and use the defaults between 0 and 1 instead.

var gradient = regenbogen(['black', 'white'],[0, 1]);
gradient(0); // rgba(0, 0, 0, 1)
gradient(1); // rgba(255, 255, 255, 1)
gradient(null); // rgba(0, 0, 0, 0);
gradient(undefined); // rgba(0, 0, 0, 0);

var gradient = regenbogen(['red', 'green', 'blue']);
gradient(0.5); // rgba(0, 255, 0, 1)

Perfectly suited for use in Array.prototype.map: [0, 5, 1].map(regenbogen(['black', 'white'])); // ['rgba(0, 0, 0, 1)' // , 'rgba(127, 127, 127, 1)' // , 'rgba(255, 255, 255, 1)]