diff --git a/client/components/build/RightSidebar/sections/Theme.tsx b/client/components/build/RightSidebar/sections/Theme.tsx
index af1883865..80e731080 100644
--- a/client/components/build/RightSidebar/sections/Theme.tsx
+++ b/client/components/build/RightSidebar/sections/Theme.tsx
@@ -19,7 +19,7 @@ const Theme = () => {
   const { background, text, primary } = useAppSelector<ThemeType>((state) => get(state.resume, 'metadata.theme'));
 
   const handleChange = (property: string, color: string) => {
-    dispatch(setResumeState({ path: `metadata.theme.${property}`, value: color }));
+    dispatch(setResumeState({ path: `metadata.theme.${property}`, value: color[0] !== '#' ? `#${color}` : color }));
   };
 
   return (