diff --git a/invokeai/frontend/web/src/features/regionalPrompts/components/RPLayerListItem.tsx b/invokeai/frontend/web/src/features/regionalPrompts/components/RPLayerListItem.tsx
index b7db264ea6..045a43c12f 100644
--- a/invokeai/frontend/web/src/features/regionalPrompts/components/RPLayerListItem.tsx
+++ b/invokeai/frontend/web/src/features/regionalPrompts/components/RPLayerListItem.tsx
@@ -1,6 +1,6 @@
 import { Flex, Spacer } from '@invoke-ai/ui-library';
 import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
-import { rgbaColorToString } from 'features/canvas/util/colorToString';
+import { rgbColorToString } from 'features/canvas/util/colorToString';
 import { RPLayerAutoNegativeCombobox } from 'features/regionalPrompts/components/RPLayerAutoNegativeCombobox';
 import { RPLayerColorPicker } from 'features/regionalPrompts/components/RPLayerColorPicker';
 import { RPLayerMenu } from 'features/regionalPrompts/components/RPLayerMenu';
@@ -21,14 +21,22 @@ export const RPLayerListItem = memo(({ layerId }: Props) => {
   const color = useAppSelector((s) => {
     const layer = s.regionalPrompts.present.layers.find((l) => l.id === layerId);
     assert(isRPLayer(layer), `Layer ${layerId} not found or not an RP layer`);
-    return rgbaColorToString({ ...layer.color, a: selectedLayerId === layerId ? 1 : 0.35 });
+    return rgbColorToString(layer.color);
   });
   const onClickCapture = useCallback(() => {
     // Must be capture so that the layer is selected before deleting/resetting/etc
     dispatch(rpLayerSelected(layerId));
   }, [dispatch, layerId]);
   return (
-    <Flex gap={2} onClickCapture={onClickCapture} bg={color} borderRadius="base" p="1px" ps={3}>
+    <Flex
+      gap={2}
+      onClickCapture={onClickCapture}
+      bg={color}
+      borderRadius="base"
+      p="1px"
+      ps={2}
+      opacity={selectedLayerId === layerId ? 1 : 0.5}
+    >
       <Flex flexDir="column" gap={2} w="full" bg="base.850" borderRadius="base" p={2}>
         <Flex gap={2} alignItems="center">
           <RPLayerColorPicker layerId={layerId} />
diff --git a/invokeai/frontend/web/src/features/regionalPrompts/components/RegionalPromptsEditor.tsx b/invokeai/frontend/web/src/features/regionalPrompts/components/RegionalPromptsEditor.tsx
index f3803d7ff7..b7c9bdfa5c 100644
--- a/invokeai/frontend/web/src/features/regionalPrompts/components/RegionalPromptsEditor.tsx
+++ b/invokeai/frontend/web/src/features/regionalPrompts/components/RegionalPromptsEditor.tsx
@@ -30,7 +30,7 @@ export const RegionalPromptsEditor = memo(() => {
   const rpLayerIdsReversed = useAppSelector(selectRPLayerIdsReversed);
   return (
     <Flex gap={4} w="full" h="full">
-      <Flex flexDir="column" gap={4} flexShrink={0}>
+      <Flex flexDir="column" gap={4} flexShrink={0} w={430}>
         <Flex gap={3}>
           <ButtonGroup isAttached={false}>
             <Button onClick={debugBlobs}>🐛</Button>