我想创建一个函数，它将接受任何旧字符串(通常是一个单词)，并从中以某种方式生成一个十六进制值在#000000和#FFFFFF之间，所以我可以使用它作为HTML元素的颜色。
如果不那么复杂的话，甚至可能是一个简化的十六进制值(例如:#FFF)。事实上，“网络安全”调色板中的颜色是最理想的。
当前回答
我在一行中将其转换为Python
import hashlib
hash = hashlib.sha1(b'user@email.com').hexdigest()
print("#" + hash[0:6])
其他回答
2023版本普通和简单的TypeScript箭头函数，返回HSL颜色。
const stringToColor = (value: string) => {
let hash = 0;
for (let i = 0; i < value.length; i++) {
hash = value.charCodeAt(i) + ((hash << 5) - hash);
}
return `hsl(${hash % 360}, 85%, 35%)`;
};
只是将Java从Compute的十六进制颜色代码任意字符串移植到Javascript:
function hashCode(str) { // java String#hashCode
var hash = 0;
for (var i = 0; i < str.length; i++) {
hash = str.charCodeAt(i) + ((hash << 5) - hash);
}
return hash;
}
function intToRGB(i){
var c = (i & 0x00FFFFFF)
.toString(16)
.toUpperCase();
return "00000".substring(0, 6 - c.length) + c;
}
转换你会做:
intToRGB(hashCode(your_string))
以下是对CD Sanchez的答案的改编，它始终返回一个6位数的颜色代码:
var stringToColour = function(str) {
var hash = 0;
for (var i = 0; i < str.length; i++) {
hash = str.charCodeAt(i) + ((hash << 5) - hash);
}
var colour = '#';
for (var i = 0; i < 3; i++) {
var value = (hash >> (i * 8)) & 0xFF;
colour += ('00' + value.toString(16)).substr(-2);
}
return colour;
}
用法:
stringToColour("greenish");
// -> #9bc63b
例子:
http://jsfiddle.net/sUK45/
(另一种/更简单的解决方案可能涉及返回'rgb(…)'风格的颜色代码。)
我已经打开了一个pull request to Please.js，它允许从散列中生成颜色。
你可以像这样将字符串映射到一个颜色:
const color = Please.make_color({
from_hash: "any string goes here"
});
例如，"any string goes here"将返回"#47291b" “another!”返回为“#1f0c3d”
使用hashCode，就像Cristian Sanchez用hsl和现代javascript回答的那样，你可以创建一个具有良好对比度的颜色选择器，如下所示:
函数hashCode(str) { 设hash = 0; For (var I = 0;I < str.length;我+ +){ hash = str.charCodeAt(i) + ((hash << 5) - hash); ｝ 返回哈希; ｝ 函数pickColor(str) { 返回' hsl(${hashCode(str) % 360}， 100%， 80%) '; ｝ one.style.backgroundColor = pickColor(one.innerText) two.style.backgroundColor = pickColor(two.innerText) div { 填充:10 px; ｝ < div id = " 1 " > < / div >一 < div id = "两个“>两个div > < /
因为它是hsl，你可以缩放亮度来得到你想要的对比度。
function hashCode(str) { let hash = 0; for (var i = 0; i < str.length; i++) { hash = str.charCodeAt(i) + ((hash << 5) - hash); } return hash; } function pickColor(str) { // Note the last value here is now 50% instead of 80% return `hsl(${hashCode(str) % 360}, 100%, 50%)`; } one.style.backgroundColor = pickColor(one.innerText) two.style.backgroundColor = pickColor(two.innerText) div { color: white; padding: 10px; } <div id="one">One</div> <div id="two">Two</div>
