diff --git a/src/colors.config.ts b/src/colors.config.ts
index 0101bfdf41..d458db9eff 100644
--- a/src/colors.config.ts
+++ b/src/colors.config.ts
@@ -65,8 +65,8 @@ const colors = {
     exportTextareaColor: 'rgba(170, 170, 170, 1)', // #aaa, also used in anchorButton
     inherit: 'inherit',
     currentColor: 'currentColor',
-    alertBorder: 'rgba(36, 36, 36, 1)',
-    alertBg: 'rgba(23, 23, 23, 1)', // #171717
+    panelBorder: 'rgba(36, 36, 36, 1)',
+    panelBg: 'rgba(23, 23, 23, 1)', // #171717
   },
   light: {
     // Background colors in capacitor app needs to be in hexadecimal codes
@@ -134,8 +134,8 @@ const colors = {
     exportTextareaColor: 'rgba(85, 85, 85, 1)',
     inherit: 'inherit',
     currentColor: 'currentColor',
-    alertBorder: 'rgba(219, 219, 219, 1)',
-    alertBg: 'rgba(232, 232, 232, 1)', // #171717
+    panelBorder: 'rgba(219, 219, 219, 1)',
+    panelBg: 'rgba(232, 232, 232, 1)', // #171717
   },
 } as const
 
diff --git a/src/components/Alert.tsx b/src/components/Alert.tsx
index e6a97c21f6..d61747e8bc 100644
--- a/src/components/Alert.tsx
+++ b/src/components/Alert.tsx
@@ -51,8 +51,8 @@ const Alert: FC = () => {
               bottom: '36px',
               left: '50%',
               transform: 'translateX(-50%)',
-              background: 'alertBg',
-              border: '1px solid {colors.alertBorder}',
+              background: 'panelBg',
+              border: '1px solid {colors.panelBorder}',
               borderRadius: '8px',
               zIndex: 'popup',
             })}