const r = document.getElementById(“rRange”);
const g = document.getElementById(“gRange”);
const b = document.getElementById(“bRange”);
const rVal = document.getElementById(“rVal”);
const gVal = document.getElementById(“gVal”);
const bVal = document.getElementById(“bVal”);
const colorPreview = document.getElementById(“colorPreview”);
const hexCode = document.getElementById(“hexCode”);

function updateColor() {
const rV = parseInt(r.value);
const gV = parseInt(g.value);
const bV = parseInt(b.value);

rVal.textContent = rV;
gVal.textContent = gV;
bVal.textContent = bV;

const hex = “#” + [rV, gV, bV]
.map(x => x.toString(16).padStart(2, “0”))
.join(“”)
.toUpperCase();

colorPreview.style.backgroundColor = hex;
colorPreview.textContent = hex;
hexCode.textContent = hex;
colorPreview.style.color = (rV+gV+bV)/3 < 128 ? "white" : "black";
}

r.addEventListener("input", updateColor);
g.addEventListener("input", updateColor);
b.addEventListener("input", updateColor);

updateColor(); // Initialize

(adsbygoogle = window.adsbygoogle || []).push({});