你可以用这个简单的函数

function getRandomColor(){
 var color =  "#" + (Math.random() * 0xFFFFFF << 0).toString(16);
 return color;
}

函数 getHashColor（） { var hash = “0123456789ABCDEF”; var hashColor = “#”; for （var i = 0; i < 6; i++） hashColor += hash[Math.floor（Math.random（） * hash.length）]; document.getElementById（'demo'）.style.background = hashColor } <div id=“demo” style=“background：red;height：300px;width：300px”></div> <button type=“button” onclick=“getHashColor（）”>Clik Me</button>

此方法将获得一个随机数，将其转换为十六进制字符串，然后提取它的一部分，从而得到一个随机十六进制。

function randomColor() {
    return "#" + Math.random().toString(16).slice(2,8);
}

我想创造非常独特和充满活力的颜色(用于绘图)。对于任何严重的问题，hsl是一个比rgb更好的方法。如有必要，您可以像其他人已经提到的那样将hsl转换为rgb。

简单的方法:

创建一个从0到360的随机色调 创建一个从0.5到1(或50到100)的随机饱和度 将亮度设置为50%以获得最佳能见度。

color_generator = () => hsl (360*Math.random(), 0.5 + Math.random()/2, 0.5)

修改方法

它创造了一个非常明亮和生动的颜色光谱，但问题是，在通常的颜色光谱中，红色、绿色、蓝色比黄色、青色和紫色更占主导地位。我通过acos函数变换了色调。技术原因很无聊，所以我跳过了，但你可以在维基上挖掘。

color_generator = () => {
    let color_section = Math.floor(Math.random()/0.33) // there are three section in full spectrum
    let transformed_hue = Math.acos(2*Math.random() - 1)/3.14 // transform so secondary colors would be as dominant as the primary colors
    let hue = 120*color_section + 120*transformed_hue
    return hsl(hue, 0.5 + Math.random()/2, 0.5)
}

在尝试了许多其他方法后，这是我得到的最好的色谱。

引用:

https://observablehq.com/@d3/color-schemes https://en.wikipedia.org/wiki/HSL_and_HSV

这个函数在两个方面超越了其他答案:

它试图生成尽可能不同的颜色 20种颜色中哪一种与欧几里得距离最远 其他的都在HSV锥内。

它允许你限制色调， 饱和度，或值范围，但它仍然试图选择颜色作为 在这个范围内尽可能的不同。

它不是超级高效，但对于合理的值(谁甚至可以轻松地区分100种颜色?)够快了。

请参阅 JSFiddle

  /**
   * Generates a random palette of HSV colors.  Attempts to pick colors
   * that are as distinct as possible within the desired HSV range.
   *
   * @param {number}    [options.numColors=10] - the number of colors to generate
   * @param {number[]}  [options.hRange=[0,1]] - the maximum range for generated hue
   * @param {number[]}  [options.sRange=[0,1]] - the maximum range for generated saturation
   * @param {number[]}  [options.vRange=[0,1]] - the maximum range for generated value
   * @param {number[][]}[options.exclude=[[0,0,0],[0,0,1]]] - colors to exclude
   *
   * @returns {number[][]} an array of HSV colors (each HSV color
   * is a [hue, saturation, value] array)
   */
  function randomHSVPalette(options) {
    function random(min, max) {
      return min + Math.random() * (max - min);
    }

    function HSVtoXYZ(hsv) {
      var h = hsv[0];
      var s = hsv[1];
      var v = hsv[2];
      var angle = h * Math.PI * 2;
      return [Math.sin(angle) * s * v,
              Math.cos(angle) * s * v,
              v];
    }

    function distSq(a, b) {
      var dx = a[0] - b[0];
      var dy = a[1] - b[1];
      var dz = a[2] - b[2];
      return dx * dx + dy * dy + dz * dz;
    }

    if (!options) {
      options = {};
    }

    var numColors = options.numColors || 10;
    var hRange = options.hRange || [0, 1];
    var sRange = options.sRange || [0, 1];
    var vRange = options.vRange || [0, 1];
    var exclude = options.exclude || [[0, 0, 0], [0, 0, 1]];

    var points = exclude.map(HSVtoXYZ);
    var result = [];

    while (result.length < numColors) {
      var bestHSV;
      var bestXYZ;
      var bestDist = 0;
      for (var i = 0; i < 20; i++) {
        var hsv = [random(hRange[0], hRange[1]), random(sRange[0], sRange[1]), random(vRange[0], vRange[1])];
        var xyz = HSVtoXYZ(hsv);
        var minDist = 10;
        points.forEach(function(point) {
          minDist = Math.min(minDist, distSq(xyz, point));
        });
        if (minDist > bestDist) {
          bestHSV = hsv;
          bestXYZ = xyz;
          bestDist = minDist;
        }
      }
      points.push(bestXYZ);
      result.push(bestHSV);
    }

    return result;
  }

  function HSVtoRGB(hsv) {
    var h = hsv[0];
    var s = hsv[1];
    var v = hsv[2];

    var i = ~~(h * 6);
    var f = h * 6 - i;
    var p = v * (1 - s);
    var q = v * (1 - f * s);
    var t = v * (1 - (1 - f) * s);
    v = ~~(255 * v);
    p = ~~(255 * p);
    q = ~~(255 * q);
    t = ~~(255 * t);
    switch (i % 6) {
      case 0: return [v, t, p];
      case 1: return [q, v, p];
      case 2: return [p, v, t];
      case 3: return [p, q, v];
      case 4: return [t, p, v];
      case 5: return [v, p, q];
    }
  }

  function RGBtoCSS(rgb) {
    var r = rgb[0];
    var g = rgb[1];
    var b = rgb[2];
    var rgb = (r << 16) + (g << 8) + b;
    return '#' + ('000000' + rgb.toString(16)).slice(-6);
  }

这段代码(Mohsen的)不能生成像#fcfc80这样的颜色。

'#' + Math.random().toString(16).substr(-6);

Nicolas Buduroi的方法有效，除非Math.random()返回0，合理。

'#' + (Math.random().toString(16) + "000000").substring(2,8)

这段代码生成了很多非法的颜色(比如#abcde)。

'#' + Math.floor(Math.random()*16777215).toString(16);

我一直在用(+1或其他也可以，但我习惯了毫无理由的+2)

"#" + ((Math.random()+2)*16777216|0).toString(16).slice(1)