diff --git a/src/form/Toggle/Toggle.module.css b/src/form/Toggle/Toggle.module.css
index 0bc96cdf..f1d85338 100644
--- a/src/form/Toggle/Toggle.module.css
+++ b/src/form/Toggle/Toggle.module.css
@@ -1,9 +1,4 @@
 .switch {
-  /** TODO: Improve this sizing logic */
-  --toggle-width: 55px;
-  --toggle-height: 35px;
-  --toggle-handle-size: 25px;
-
   display: flex;
   align-items: center;
   justify-content: flex-start;
diff --git a/src/utils/Theme/themes/dark.ts b/src/utils/Theme/themes/dark.ts
index b57f0185..cf1909f8 100644
--- a/src/utils/Theme/themes/dark.ts
+++ b/src/utils/Theme/themes/dark.ts
@@ -350,6 +350,9 @@ export const darkTheme: Theme = {
       'select-chip-icon-color': darkColors.slate['50']
     },
     toggle: {
+      'toggle-width': '55px',
+      'toggle-height': '35px',
+      'toggle-handle-size': '25px',
       'toggle-background': darkColors.gray['100'],
       'toggle-background-checked': darkColors.blue['50'],
       'toggle-border': 'none',