// Curated palette for Group cards. Colors are hand-picked and spaced evenly // around the hue wheel so no two are near-duplicates and none clash, per the // "vibrant colors from the same aesthetic family" requirement. Stored as a // palette *key* on the Group record (not a raw hex) so this list can be // retinted centrally without a data migration. // // Each color has a slightly deeper/less-saturated `dark` variant so a thick // border doesn't glare against a dark background. export type GroupColorKey = | "coral" | "amber" | "lime" | "teal" | "sky" | "indigo" | "violet" | "pink"; export interface GroupColor { key: GroupColorKey; label: string; light: string; dark: string; } export const GROUP_COLORS: GroupColor[] = [ { key: "coral", label: "Coral", light: "#f4574a", dark: "#ff7a6e" }, { key: "amber", label: "Amber", light: "#e8940f", dark: "#f5ad3d" }, { key: "lime", label: "Lime", light: "#4c9a2a", dark: "#78c94e" }, { key: "teal", label: "Teal", light: "#0f9488", dark: "#2dd4bf" }, { key: "sky", label: "Sky", light: "#2f7fe0", dark: "#5b9dee" }, { key: "indigo", label: "Indigo", light: "#5b5bd6", dark: "#8c8cf0" }, { key: "violet", label: "Violet", light: "#9440d1", dark: "#c084fc" }, { key: "pink", label: "Pink", light: "#d63f8f", dark: "#f472b6" }, ]; const GROUP_COLOR_MAP: Record = Object.fromEntries( GROUP_COLORS.map((c) => [c.key, c]) ); export const DEFAULT_GROUP_COLOR_KEY: GroupColorKey = GROUP_COLORS[0].key; export function getGroupColor(key: string): GroupColor { return GROUP_COLOR_MAP[key] ?? GROUP_COLORS[0]; }