如何使用 JavaScript 随机生成 HTML 十六进制颜色代码？ [复制]

Posted 2023-02-23

【中文标题】如何使用 JavaScript 随机生成 HTML 十六进制颜色代码？ [复制]

【英文标题】：How do I randomly generate HTML hex color codes using JavaScript? [duplicate]

【发布时间】：2011-07-02 20:15:29

【问题描述】：

可能重复：Random Color generator in javascript

我有一些数据想以不同的颜色显示，如果可能的话，我想随机生成颜色。如何使用 JavaScript 生成十六进制颜色代码？

【参考方案1】：

这将在边界内生成一个随机数并将其转换为十六进制。然后用零填充，使其始终是有效的六位十六进制代码。

'#'+(Math.random() * 0xFFFFFF << 0).toString(16).padStart(6, '0');

【讨论】：

请注意，此方法也会输出错误的颜色代码：> '#'+(.001*0xffffff<<0).toString(16) ---> '#4189'

我不喜欢速记方式。一个无聊的手写方式会更清楚地了解正在发生的事情。如果我单独看到这段代码，我需要很长时间才能将其与其明确的目的联系起来。

我用过，然后它在某些时候显示了一些错误。请在此处使用已接受的答案***.com/questions/1484506/random-color-generator

就像@Scheintod 所说，这偶尔会产生错误的值。我刚收到#c5935

@adjenks 您的编辑是一个完全不同的答案。您应该将其发布为自己的答案，而不是删除所有其他人的代码的编辑。

【参考方案2】：

博文Random hex color code generator in JavaScript有多种方法。当随机值小于0×100000时需要补零，所以这里是正确的版本：

var randomColor = "#000000".replace(/0/g,function()return (~~(Math.random()*16)).toString(16););

这会将六个0s 中的每一个替换为一个随机的十六进制数字，因此它肯定会得到一个完整的六位有效颜色值。

【讨论】：

这是一直生成有效html代码的那个