import { Color, HSL } from "three"; const offset = { hover: { h: -0.012, s: 0, l: 0.07, }, press: { h: 0.002, s: 0.104, l: 0.207, }, disable: { h: -0.0189, s: 0, l: -0.15, }, select: { h: -0.0189, s: 0, l: -0.15, }, }; type keys = keyof typeof offset | 'pub'; export const getMouseColors = (color16: string) => { let theme = new Color(color16); // if (theme.r === theme.g && theme.g === theme.b && theme.g === 0) { // theme = new Color(themeColor) // } const themeHSL = theme.getHSL({} as HSL); const temp = new Color(); const colors = Object.entries(offset).reduce((t, [k, o]) => { t[k as keys] = '#' + temp .setHSL(themeHSL.h + o.h, themeHSL.s + o.s, themeHSL.l + o.l) .getHexString(); return t; }, {} as Record); colors.pub = color16 return { theme: '#' + theme.getHexString(), ...colors }; }