JSFiddle - React, Tailwind, and code Playground
by djp3d
JavaScript
function getContrastYIQ(r, g, b) {
var hexcolor = rgbToHex(r, g, b);
var g = parseInt(hexcolor.substr(2, 2), 16);
var b = parseInt(hexcolor.substr(4, 2), 16);
var yiq = (299 * r + 587 * g + 114 * b) / 1e3;
return yiq >= 128 ? "#111111" : "#FFFFFF";
}
function componentToHex(c) {
var hex = c.toString(16);
return 1 == hex.length ? "0" + hex : hex;
}
function rgbToHex(r, g, b) {
return componentToHex(r) + componentToHex(g) + componentToHex(b);
}
function rgbhex(r, g, b) {
return r << 16 | g << 8 | b;
}
function hex2rgb(hex) {
var red = hex >> 16;
var greenBlue = hex - (red << 16);
var green = greenBlue >> 8;
var blue = greenBlue - (green << 8);
return {
r: red,
g: green,
b: blue
};
}
function rgbIntToHex(col) {
var r = col.red;
var g = col.green;
var b = col.blue;
var hex = rgbhex(r >> 8, g >> 8, b >> 8);
var rgb = hex2rgb(hex);
return {
bg: "rgb(" + rgb.r + "," + rgb.g + "," + rgb.b + ")",
textColor: getContrastYIQ(rgb.r, rgb.g, rgb.b)
};
}
console.log(rgbIntToHex({red:397,green :8953, blue: 44768}));