SOURCE

function generateDistinctColors(count) {
  if (count > 10 || count < 1) {
    throw new Error("Count must be between 1 and 9");
  }

  const colors = [];

  while (colors.length < count) {
    const r = Math.floor(Math.random() * 256);
    const g = Math.floor(Math.random() * 256);
    const b = Math.floor(Math.random() * 256);

    const luminance = 0.299 * r + 0.587 * g + 0.114 * b;

    // Check if the color is not too bright or too dark
    if (luminance < 30 || luminance > 225) {
      continue; // Skip this color
    }

    const newColor = { r, g, b };

    // Check the distance to all existing colors
    let isDistinct = true;
    for (const color of colors) {
      const distance = Math.sqrt(
        Math.pow(color.r - newColor.r, 2) +
        Math.pow(color.g - newColor.g, 2) +
        Math.pow(color.b - newColor.b, 2)
      );
      if (distance < 80) { // Threshold can be adjusted
        isDistinct = false;
        break;
      }
    }

    if (isDistinct) {
      colors.push(newColor);
    }
  }

  return colors.map(color => `rgb(${color.r},${color.g},${color.b})`);
}

function init() {
    let container = document.getElementById('container');
    let color = generateDistinctColors(10);
    color.forEach(i => {
        const newDiv = document.createElement('div');
        // 设置 div 的内容（可选）
        newDiv.textContent = `Div ${i}`;
        // 修改 div 的样式
        newDiv.style.backgroundColor = i; // 背景颜色
        newDiv.style.margin = '10px';              // 外边距
        newDiv.style.padding = '20px';             // 内边距
        newDiv.style.border = '1px solid #ccc';    // 边框
        newDiv.style.textAlign = 'center';         // 文本居中
        newDiv.style.fontSize = '16px';            // 字体大小

        // 将新创建的 div 插入到 container 中
        container.appendChild(newDiv);
    })
}
init();

<div id="container"></div>