From 149f977961957e7a82fcdf963f9a1d6279d84db5 Mon Sep 17 00:00:00 2001
From: amandaesmith333 <amandaesmith333@gmail.com>
Date: Tue, 11 Apr 2023 12:46:49 -0500
Subject: [PATCH] fix(ColorGenerator): always prepend entered colors with pound
 sign

---
 src/components/page/theming/ColorGenerator/index.tsx | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/src/components/page/theming/ColorGenerator/index.tsx b/src/components/page/theming/ColorGenerator/index.tsx
index 66e8ffd1485..7bc86599a37 100644
--- a/src/components/page/theming/ColorGenerator/index.tsx
+++ b/src/components/page/theming/ColorGenerator/index.tsx
@@ -43,6 +43,7 @@ const ColorGenerator = (props) => {
           const { tint, shade, value } = color;
           const nameCap = name[0].toUpperCase() + name.substring(1);
 
+          const formattedValue = value.charAt(0) === '#' ? value : '#' + value;
           const isOpen = activeColor === name ? true : false;
 
           return (
@@ -52,13 +53,13 @@ const ColorGenerator = (props) => {
             >
               <div className={styles.titleRow}>
                 <div className={styles.titleRowStart}>
-                  <ColorDot color={value} />
+                  <ColorDot color={formattedValue} />
                   {nameCap}
                 </div>
                 <div className={styles.titleRowEnd}>
                   <ColorInput
                     onClick={(ev) => ev.stopPropagation()}
-                    color={value}
+                    color={formattedValue}
                     setColor={(color) =>
                       setColors((colors) => {
                         colors[name] = generateColor(color);