export const colors = { ut: { burntorange: '#BF5700', black: '#333F48', orange: '#f8971f', yellow: '#ffd600', lightgreen: '#a6cd57', green: '#579d42', teal: '#00a9b7', blue: '#005f86', gray: '#9cadb7', offwhite: '#d6d2c4', concrete: '#95a5a6', }, theme: { red: '#af2e2d', black: '#1a2024', }, } as const; type NestedKeys = { [K in keyof T]: T[K] extends Record ? `${string & K}-${string & keyof T[K]}` : never; }[keyof T]; /** * A union of all colors in the theme */ export type ThemeColor = NestedKeys; export const colorsFlattened = Object.entries(colors).reduce( (acc, [prefix, group]) => { for (const [name, hex] of Object.entries(group)) { acc[`${prefix}-${name}`] = hex; } return acc; }, {} as Record ); const hexToRgb = (hex: string) => hex.match(/[0-9a-f]{2}/gi).map(partialHex => parseInt(partialHex, 16)) as [number, number, number]; const colorsFlattenedRgb = Object.fromEntries( Object.entries(colorsFlattened).map(([name, hex]) => [name, hexToRgb(hex)]) ) as Record>; /** * Retrieves the hexadecimal color value by name from the theme. * * @param name - The name of the theme color. * @returns The hexadecimal color value. */ export const getThemeColorHexByName = (name: ThemeColor): string => colorsFlattened[name]; /** * * @param name - The name of the theme color. * @returns An array of the red, green, and blue values, respectively */ export const getThemeColorRgbByName = (name: ThemeColor) => colorsFlattenedRgb[name];