diff --git a/invokeai/frontend/web/src/common/util/colorCodeTransformers.ts b/invokeai/frontend/web/src/common/util/colorCodeTransformers.ts
index f6e47d59e2e..835b2a3e35b 100644
--- a/invokeai/frontend/web/src/common/util/colorCodeTransformers.ts
+++ b/invokeai/frontend/web/src/common/util/colorCodeTransformers.ts
@@ -1,11 +1,11 @@
 import type { RgbaColor } from 'react-colorful';
 
-export function rgbaToHex(color: RgbaColor): string {
+export function rgbaToHex(color: RgbaColor, alpha: boolean = false): string {
   const hex = ((1 << 24) + (color.r << 16) + (color.g << 8) + color.b).toString(16).slice(1);
   const alphaHex = Math.round(color.a * 255)
     .toString(16)
     .padStart(2, '0');
-  return `#${hex}${alphaHex}`;
+  return alpha ? `#${hex}${alphaHex}` : `#${hex}`;
 }
 
 export function hexToRGBA(hex: string, alpha: number) {
diff --git a/invokeai/frontend/web/src/features/nodes/components/flow/nodes/Invocation/fields/inputs/ColorFieldInputComponent.tsx b/invokeai/frontend/web/src/features/nodes/components/flow/nodes/Invocation/fields/inputs/ColorFieldInputComponent.tsx
index 545c5c40932..12f541441a8 100644
--- a/invokeai/frontend/web/src/features/nodes/components/flow/nodes/Invocation/fields/inputs/ColorFieldInputComponent.tsx
+++ b/invokeai/frontend/web/src/features/nodes/components/flow/nodes/Invocation/fields/inputs/ColorFieldInputComponent.tsx
@@ -61,7 +61,7 @@ const ColorFieldInputComponent = (props: FieldComponentProps<ColorFieldInputInst
           outline: 'none',
         }}
         className="nodrag"
-        color={rgbaToHex(color)}
+        color={rgbaToHex(color, true)}
         onChange={handleValueChanged}
         prefixed
         alpha