Last active
July 9, 2016 15:01
-
-
Save mnpenner/6513318 to your computer and use it in GitHub Desktop.
RGB <-> HSL+HSL, for Node.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/** | |
* Converts an RGB color value to HSL. Conversion formula | |
* adapted from http://en.wikipedia.org/wiki/HSL_color_space. | |
* Assumes r, g, and b are contained in the set [0, 255] and | |
* returns h, s, and l in the set [0, 1]. | |
* | |
* @param {number} r The red color value | |
* @param {number} g The green color value | |
* @param {number} b The blue color value | |
* @return {array} The HSL representation | |
*/ | |
exports.rgbToHsl = function(r, g, b){ | |
r /= 255, g /= 255, b /= 255; | |
var max = Math.max(r, g, b), min = Math.min(r, g, b); | |
var h, s, l = (max + min) / 2; | |
if(max == min){ | |
h = s = 0; // achromatic | |
}else{ | |
var d = max - min; | |
s = l > 0.5 ? d / (2 - max - min) : d / (max + min); | |
switch(max){ | |
case r: h = (g - b) / d + (g < b ? 6 : 0); break; | |
case g: h = (b - r) / d + 2; break; | |
case b: h = (r - g) / d + 4; break; | |
} | |
h /= 6; | |
} | |
return [h, s, l]; | |
}; | |
/** | |
* Converts an HSL color value to RGB. Conversion formula | |
* adapted from http://en.wikipedia.org/wiki/HSL_color_space. | |
* Assumes h, s, and l are contained in the set [0, 1] and | |
* returns r, g, and b in the set [0, 255]. | |
* | |
* @param {number} h The hue | |
* @param {number} s The saturation | |
* @param {number} l The lightness | |
* @return {array} The RGB representation | |
*/ | |
exports.hslToRgb = function(h, s, l){ | |
var r, g, b; | |
if(s == 0){ | |
r = g = b = l; // achromatic | |
}else{ | |
function hue2rgb(p, q, t){ | |
if(t < 0) t += 1; | |
if(t > 1) t -= 1; | |
if(t < 1/6) return p + (q - p) * 6 * t; | |
if(t < 1/2) return q; | |
if(t < 2/3) return p + (q - p) * (2/3 - t) * 6; | |
return p; | |
} | |
var q = l < 0.5 ? l * (1 + s) : l + s - l * s; | |
var p = 2 * l - q; | |
r = hue2rgb(p, q, h + 1/3); | |
g = hue2rgb(p, q, h); | |
b = hue2rgb(p, q, h - 1/3); | |
} | |
return [r * 255, g * 255, b * 255].map(Math.round); | |
}; | |
/** | |
* Converts an RGB color value to HSV. Conversion formula | |
* adapted from http://en.wikipedia.org/wiki/HSV_color_space. | |
* Assumes r, g, and b are contained in the set [0, 255] and | |
* returns h, s, and v in the set [0, 1]. | |
* | |
* @param {number} r The red color value | |
* @param {number} g The green color value | |
* @param {number} b The blue color value | |
* @return {array} The HSV representation | |
*/ | |
exports.rgbToHsv = function(r, g, b){ | |
r = r/255, g = g/255, b = b/255; | |
var max = Math.max(r, g, b), min = Math.min(r, g, b); | |
var h, s, v = max; | |
var d = max - min; | |
s = max == 0 ? 0 : d / max; | |
if(max == min){ | |
h = 0; // achromatic | |
}else{ | |
switch(max){ | |
case r: h = (g - b) / d + (g < b ? 6 : 0); break; | |
case g: h = (b - r) / d + 2; break; | |
case b: h = (r - g) / d + 4; break; | |
} | |
h /= 6; | |
} | |
return [h, s, v]; | |
}; | |
/** | |
* Converts an HSV color value to RGB. Conversion formula | |
* adapted from http://en.wikipedia.org/wiki/HSV_color_space. | |
* Assumes h, s, and v are contained in the set [0, 1] and | |
* returns r, g, and b in the set [0, 255]. | |
* | |
* @param {number} h The hue | |
* @param {number} s The saturation | |
* @param {number} v The value | |
* @return {array} The RGB representation | |
*/ | |
exports.hsvToRgb = function(h, s, v){ | |
var r, g, b; | |
var i = Math.floor(h * 6); | |
var f = h * 6 - i; | |
var p = v * (1 - s); | |
var q = v * (1 - f * s); | |
var t = v * (1 - (1 - f) * s); | |
switch(i % 6){ | |
case 0: r = v, g = t, b = p; break; | |
case 1: r = q, g = v, b = p; break; | |
case 2: r = p, g = v, b = t; break; | |
case 3: r = p, g = q, b = v; break; | |
case 4: r = t, g = p, b = v; break; | |
case 5: r = v, g = p, b = q; break; | |
} | |
return [r * 255, g * 255, b * 255].map(Math.round); | |
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
#!/usr/local/bin/mocha | |
var expect = require('chai').expect; | |
var color = require('./color.js'); | |
describe('color', function() { | |
it('hsl', function() { | |
var r=11, g=48, b=192; | |
var hsl = color.rgbToHsl(r,g,b); | |
var rgb = color.hslToRgb(hsl[0],hsl[1],hsl[2]); | |
expect(rgb).to.equal([r,g,b]); | |
}); | |
it('hsv', function() { | |
var r=11, g=48, b=192; | |
var hsv = color.rgbToHsv(r,g,b); | |
var rgb = color.hsvToRgb(hsv[0],hsv[1],hsv[2]); | |
expect(rgb).to.equal([r,g,b]); | |
}); | |
}); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment