Skip to content

Instantly share code, notes, and snippets.

@Aries0d0f
Last active October 27, 2020 04:04
Show Gist options
  • Save Aries0d0f/755194513051e7610f3d7c39baa3cf75 to your computer and use it in GitHub Desktop.
Save Aries0d0f/755194513051e7610f3d7c39baa3cf75 to your computer and use it in GitHub Desktop.
JavaScript RGB Color Gradient Parser
const colorParserInt = rgb => {
const [_, r, g, b] = rgb.toUpperCase().match(/([A-Fa-f0-9]{2})([A-Fa-f0-9]{2})([A-Fa-f0-9]{2})/);
return {
r: parseInt(`0x${r}`),
g: parseInt(`0x${g}`),
b: parseInt(`0x${b}`)
};
}
const colorParserHex = (r, g, b) => {
return `${r.toString(16)}${g.toString(16)}${b.toString(16)}`.toUpperCase();
}
const gradientConverter = (startColor, endColor, calcPoint) => {
const start = colorParserInt(startColor);
const end = colorParserInt(endColor);
return calcColor = colorParserHex(
Math.floor(start.r * calcPoint + end.r * (1 - calcPoint)),
Math.floor(start.g * calcPoint + end.g * (1 - calcPoint)),
Math.floor(start.b * calcPoint + end.b * (1 - calcPoint))
);
}
@Aries0d0f
Copy link
Author

Usage example:

gradientConverter("6E0CAD", "202124", 0.3);
// '371A4D'

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment