From e5b6725081bdd80598373a68940cd7d52a810596 Mon Sep 17 00:00:00 2001
From: Kyle Pope <kyle.a.pope@outlook.com>
Date: Wed, 25 Feb 2026 09:32:19 +0800
Subject: [PATCH] Add red, pink, yellow HSL presets to useTheme accent color
 map

The swatches were added to SettingsPage but useTheme only had 5 presets,
so selecting the new colors saved to DB but never applied CSS variables.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 frontend/src/hooks/useTheme.ts | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/frontend/src/hooks/useTheme.ts b/frontend/src/hooks/useTheme.ts
index 9ca6961..27d4f5d 100644
--- a/frontend/src/hooks/useTheme.ts
+++ b/frontend/src/hooks/useTheme.ts
@@ -7,6 +7,9 @@ const ACCENT_PRESETS: Record<string, { h: number; s: number; l: number }> = {
   purple: { h: 258, s: 89.5, l: 66.3 },
   orange: { h: 21, s: 94.6, l: 53.3 },
   green: { h: 142, s: 70.6, l: 45.3 },
+  red: { h: 0, s: 84.2, l: 60.2 },
+  pink: { h: 330, s: 81.2, l: 60.4 },
+  yellow: { h: 48, s: 83.3, l: 47.5 },
 };
 
 export function useTheme() {