Spot the bug - #171: Hex Palette Blender

programming web dev
1

Color mixer function keeps generating invalid hexadecimal string values.

function parseHexColor(hex) {
  const clean = hex.replace('#', '');
  const num = parseInt(clean, 16);
  return {
    r: (num >> 16) & 255,
    g: (num >> 8) & 255,
    b: num & 255
  };
}

function blendRgb(c1, c2, ratio) {
  const clamped = Math.min(Math.max(ratio, 0), 1);
  return {
    r: Math.round(c1.r + (c2.r - c1.r) * clamped),
    g: Math.round(c1.g + (c2.g - c1.g) * clamped),
    b: Math.round(c1.b + (c2.b - c1.b) * clamped)
  };
}

function formatHexColor(rgb) {
  const r = rgb.r.toString(16);
  const g = rgb.g.toString(16);
  const b = rgb.b.toString(16);
  return `#${r}${g}${b}`;
}

function generatePaletteSteps(startHex, endHex, totalSteps) {
  const start = parseHexColor(startHex);
  const end = parseHexColor(endHex);
  const palette = [];
  const stepFactor = 1 / (totalSteps - 1);

  for (let i = 0; i < totalSteps; i++) {
    const blended = blendRgb(start, end, i * stepFactor);
    palette.push(formatHexColor(blended));
  }

  return palette;
}

const mysticSwatches = generatePaletteSteps('#050a0f', '#e0f810', 8);

Reply with what is broken and how you would fix it.