diff --git a/invokeai/frontend/web/src/features/controlLayers/components/CanvasEntityList/EntityListSelectedEntityActionBarFill.tsx b/invokeai/frontend/web/src/features/controlLayers/components/CanvasEntityList/EntityListSelectedEntityActionBarFill.tsx
index 117d3bc84f..21383b93c4 100644
--- a/invokeai/frontend/web/src/features/controlLayers/components/CanvasEntityList/EntityListSelectedEntityActionBarFill.tsx
+++ b/invokeai/frontend/web/src/features/controlLayers/components/CanvasEntityList/EntityListSelectedEntityActionBarFill.tsx
@@ -50,7 +50,14 @@ export const EntityListSelectedEntityActionBarFill = memo(() => {
         <Flex role="button" aria-label={t('controlLayers.maskFill')} tabIndex={-1} w={8} h={8}>
           <Tooltip label={t('controlLayers.maskFill')}>
             <Flex w="full" h="full" alignItems="center" justifyContent="center">
-              <Box borderRadius="full" w={6} h={6} borderWidth={1} bg={rgbColorToString(fill.color)} />
+              <Box
+                borderRadius="full"
+                borderColor="base.300"
+                w={6}
+                h={6}
+                borderWidth={1}
+                bg={rgbColorToString(fill.color)}
+              />
             </Flex>
           </Tooltip>
         </Flex>
diff --git a/invokeai/frontend/web/src/features/controlLayers/components/Tool/ToolFillColorPicker.tsx b/invokeai/frontend/web/src/features/controlLayers/components/Tool/ToolFillColorPicker.tsx
index 87d8ff2a3b..c12f3af7b1 100644
--- a/invokeai/frontend/web/src/features/controlLayers/components/Tool/ToolFillColorPicker.tsx
+++ b/invokeai/frontend/web/src/features/controlLayers/components/Tool/ToolFillColorPicker.tsx
@@ -26,7 +26,14 @@ export const ToolColorPicker = memo(() => {
         <Flex role="button" aria-label={t('controlLayers.fill.fillColor')} tabIndex={-1} w={8} h={8}>
           <Tooltip label={t('controlLayers.fill.fillColor')}>
             <Flex w="full" h="full" alignItems="center" justifyContent="center">
-              <Box borderRadius="full" w={6} h={6} borderWidth={1} bg={rgbaColorToString(fill)} />
+              <Box
+                borderRadius="full"
+                borderColor="base.300"
+                w={6}
+                h={6}
+                borderWidth={1}
+                bg={rgbaColorToString(fill)}
+              />
             </Flex>
           </Tooltip>
         </Flex>