사용자에게 색상 제공

이것은 정말 빠른 것입니다!

채팅 앱이나 프로필이 있는 것과 같이 사용자가 서로 상호 작용하는 프로젝트가 있는 경우 색상을 할당하는 것이 좋을 수 있습니다. WhatsApp 이름과 비슷합니다. 문제는 동일한 사용자가 항상 자신과 동일한 색상을 가지도록 하는 방법이지만 실제로는 무작위로 넓은 범위 내에 있습니까?

ASCII 키 코드와 모듈로 연산자를 사용하고 HSL과 결합하여 항상 무작위이지만 동일한 색조를 반환하여 모든 문자열을 색상으로 변환하는 빠른 솔루션을 얻을 수 있습니다.


const name = 'Michael Jordan';
const characters = name.split('');
const code = characters.map(a => a.charCodeAt(0)).join('');
// code is 771059910497101108327411111410097110
const hue = code % 255;
const nameHSL = `hsl(${hue}, 80%, 40%)`;



물론 두 개의 Michael Jordans가 있는 경우 UID 또는 'user created at' 타임스탬프를 사용하는 것이 더 나을 수도 있습니다. 이것은 문자 그대로 모든 문자열에서 작동합니다!

궁금하신 분들을 위해 MJ는 이 잎이 무성한 녹색입니다.



사랑스러운.

좋은 웹페이지 즐겨찾기