프로그래밍/JS, Node.js
[typescript] 어두운 색깔인지 확인 (isDarkColor, HEX, RGB, tinycolor)
Lou Park
2022. 8. 14. 17:35
export default function isDarkColor(color: string) {
var result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(color);
if (result == null) {
return false;
}
var rgb = {
r: parseInt(result[1], 16),
g: parseInt(result[2], 16),
b: parseInt(result[3], 16)
}
let hsp = Math.sqrt(
0.299 * (rgb.r * rgb.r) +
0.587 * (rgb.g * rgb.g) +
0.114 * (rgb.b * rgb.b)
);
return hsp <= 127.5;
}
// Usage
isDarkColor('#89E2D0');
배경색에 따라 글자 색상을 달리하고 싶을때 사용하면 된다. 흰 글자가 잘보이는 어두운 색상이면 True를 리턴한다.
저렇게 단순한 기능을하는 TS라이브러리가 안보여서... 아래 두 사이트 소스코드를 짬뽕해서 만들었다.
https://awik.io/determine-color-bright-dark-using-javascript/
https://stackoverflow.com/questions/5623838/rgb-to-hex-and-hex-to-rgb