diff --git a/stylesheets/components/SignalConnectionsModal.scss b/stylesheets/components/SignalConnectionsModal.scss
index 48dc36a4f9..12737d5d22 100644
--- a/stylesheets/components/SignalConnectionsModal.scss
+++ b/stylesheets/components/SignalConnectionsModal.scss
@@ -2,8 +2,6 @@
 // SPDX-License-Identifier: AGPL-3.0-only
 
 .SignalConnectionsModal {
-  color: $color-gray-05;
-
   &__icon {
     @include color-svg(
       '../images/icons/v2/signal-connections.svg',
diff --git a/ts/components/SignalConnectionsModal.tsx b/ts/components/SignalConnectionsModal.tsx
index 552c6e53ba..6db2824831 100644
--- a/ts/components/SignalConnectionsModal.tsx
+++ b/ts/components/SignalConnectionsModal.tsx
@@ -7,6 +7,7 @@ import type { LocalizerType } from '../types/Util';
 import { Button, ButtonVariant } from './Button';
 import { Intl } from './Intl';
 import { Modal } from './Modal';
+import { STORIES_COLOR_THEME } from './Stories';
 
 export type PropsType = {
   i18n: LocalizerType;
@@ -23,6 +24,7 @@ export function SignalConnectionsModal({
       hasXButton
       i18n={i18n}
       onClose={onClose}
+      theme={STORIES_COLOR_THEME}
     >
       <div className="SignalConnectionsModal">
         <i className="SignalConnectionsModal__icon" />
diff --git a/ts/components/Stories.tsx b/ts/components/Stories.tsx
index 80bde45a0e..41dbf82ce4 100644
--- a/ts/components/Stories.tsx
+++ b/ts/components/Stories.tsx
@@ -56,6 +56,8 @@ export type PropsType = {
   viewUserStories: ViewUserStoriesActionCreatorType;
 };
 
+export const STORIES_COLOR_THEME = Theme.Dark;
+
 export function Stories({
   addStoryData,
   deleteStoryForEveryone,
@@ -102,7 +104,7 @@ export function Stories({
   );
 
   return (
-    <div className={classNames('Stories', themeClassName(Theme.Dark))}>
+    <div className={classNames('Stories', themeClassName(STORIES_COLOR_THEME))}>
       {addStoryData && renderStoryCreator()}
       <div className="Stories__pane" style={{ width }}>
         {isMyStories && myStories.length ? (