diff --git a/design-tokens/input/tokens.json b/design-tokens/input/tokens.json
index 16993284..551b74c0 100644
--- a/design-tokens/input/tokens.json
+++ b/design-tokens/input/tokens.json
@@ -5077,11 +5077,11 @@
             "checkedHoverBackground": "{color.bg.neutral.strong.hover}"
           },
           "handle": {
-            "background": "{color.bg.surface.raised.default}",
-            "hoverBackground": "{color.bg.surface.raised.default}",
+            "background": "{color.fg.on.fill.default}",
+            "hoverBackground": "{color.fg.on.fill.default}",
             "disabledBackground": "{color.bg.neutral.medium.strong}",
-            "checkedBackground": "{color.bg.surface.raised.default}",
-            "checkedHoverBackground": "{color.bg.surface.raised.default}",
+            "checkedBackground": "{color.fg.inverse.active}",
+            "checkedHoverBackground": "{color.fg.inverse.active}",
             "color": "{color.fg.default}",
             "hoverColor": "{color.fg.default}",
             "checkedColor": "{color.fg.default}",
@@ -5090,22 +5090,22 @@
         },
         "dark": {
           "handle": {
-            "background": "{color.bg.surface.raised.default}",
-            "checkedBackground": "{color.bg.surface.raised.default}",
+            "background": "{color.fg.on.fill.default}",
+            "checkedBackground": "{color.fg.inverse.active}",
             "checkedColor": "{color.fg.inverse.focus}",
-            "checkedHoverBackground": "{color.bg.surface.raised.default}",
+            "checkedHoverBackground": "{color.fg.inverse.active}",
             "checkedHoverColor": "{color.fg.on.brand.hover}",
             "color": "{color.fg.inverse.default}",
-            "disabledBackground": "{color.bg.surface.raised.active}",
-            "hoverBackground": "{color.bg.surface.raised.default}",
+            "disabledBackground": "{color.bg.neutral.medium.strong}",
+            "hoverBackground": "{color.fg.on.fill.default}",
             "hoverColor": "{color.fg.on.brand.hover}"
           },
           "root": {
             "background": "{color.bg.neutral.medium.active}",
-            "checkedBackground": "{color.bg.surface.canvas.default}",
-            "checkedHoverBackground": "{color.bg.surface.canvas.hover}",
-            "disabledBackground": "{color.bg.neutral.strong.hover}",
-            "hoverBackground": "{color.bg.surface.raised.active}"
+            "checkedBackground": "{color.bg.neutral.strong.default}",
+            "checkedHoverBackground": "{color.bg.neutral.strong.hover}",
+            "disabledBackground": "{color.bg.surface.canvas.hover}",
+            "hoverBackground": "{color.bg.neutral.medium.strong}"
           }
         }
       },
diff --git a/src/components/Input/InputSwitch/InputSwitch.tsx b/src/components/Input/InputSwitch/InputSwitch.tsx
index bb06abf2..8c27dc2c 100644
--- a/src/components/Input/InputSwitch/InputSwitch.tsx
+++ b/src/components/Input/InputSwitch/InputSwitch.tsx
@@ -21,7 +21,7 @@ export const InputSwitch = memo<InputSwitchProps>(
   }) => {
     const { containerStyle, sliderStyle, onPressIn, onPressOut } =
       useSliderStyles(checked, disabled, danger)
-    const { handleStyle } = useHandleStyles(checked)
+    const { handleStyle } = useHandleStyles(checked, disabled)
 
     const handlePress = useCallback(() => {
       onCheckedChange?.(!checked)
diff --git a/src/components/Input/InputSwitch/__tests__/__snapshots__/InputSwitch.test.tsx.snap b/src/components/Input/InputSwitch/__tests__/__snapshots__/InputSwitch.test.tsx.snap
index 9b89404e..5e788d96 100644
--- a/src/components/Input/InputSwitch/__tests__/__snapshots__/InputSwitch.test.tsx.snap
+++ b/src/components/Input/InputSwitch/__tests__/__snapshots__/InputSwitch.test.tsx.snap
@@ -321,7 +321,7 @@ exports[`InputSwitch component tests checked - false, danger - false, disabled -
       }
       jestInlineStyle={
         {
-          "backgroundColor": ""#ffffff"",
+          "backgroundColor": ""#85888e"",
           "borderRadius": 1600,
           "height": 16,
           "left": "3",
@@ -333,7 +333,7 @@ exports[`InputSwitch component tests checked - false, danger - false, disabled -
       style={
         [
           {
-            "backgroundColor": "#ffffff",
+            "backgroundColor": "#85888e",
             "borderRadius": 1600,
             "height": 16,
             "left": 3,
@@ -437,7 +437,7 @@ exports[`InputSwitch component tests checked - false, danger - false, disabled -
       }
       jestInlineStyle={
         {
-          "backgroundColor": ""#ffffff"",
+          "backgroundColor": ""#85888e"",
           "borderRadius": 1600,
           "height": 16,
           "left": "3",
@@ -449,7 +449,7 @@ exports[`InputSwitch component tests checked - false, danger - false, disabled -
       style={
         [
           {
-            "backgroundColor": "#ffffff",
+            "backgroundColor": "#85888e",
             "borderRadius": 1600,
             "height": 16,
             "left": 3,
@@ -785,7 +785,7 @@ exports[`InputSwitch component tests checked - false, danger - true, disabled -
       }
       jestInlineStyle={
         {
-          "backgroundColor": ""#ffffff"",
+          "backgroundColor": ""#85888e"",
           "borderRadius": 1600,
           "height": 16,
           "left": "3",
@@ -797,7 +797,7 @@ exports[`InputSwitch component tests checked - false, danger - true, disabled -
       style={
         [
           {
-            "backgroundColor": "#ffffff",
+            "backgroundColor": "#85888e",
             "borderRadius": 1600,
             "height": 16,
             "left": 3,
@@ -901,7 +901,7 @@ exports[`InputSwitch component tests checked - false, danger - true, disabled -
       }
       jestInlineStyle={
         {
-          "backgroundColor": ""#ffffff"",
+          "backgroundColor": ""#85888e"",
           "borderRadius": 1600,
           "height": 16,
           "left": "3",
@@ -913,7 +913,7 @@ exports[`InputSwitch component tests checked - false, danger - true, disabled -
       style={
         [
           {
-            "backgroundColor": "#ffffff",
+            "backgroundColor": "#85888e",
             "borderRadius": 1600,
             "height": 16,
             "left": 3,
@@ -1249,7 +1249,7 @@ exports[`InputSwitch component tests checked - true, danger - false, disabled -
       }
       jestInlineStyle={
         {
-          "backgroundColor": ""#ffffff"",
+          "backgroundColor": ""#85888e"",
           "borderRadius": 1600,
           "height": 16,
           "left": "19",
@@ -1261,7 +1261,7 @@ exports[`InputSwitch component tests checked - true, danger - false, disabled -
       style={
         [
           {
-            "backgroundColor": "#ffffff",
+            "backgroundColor": "#85888e",
             "borderRadius": 1600,
             "height": 16,
             "left": 19,
@@ -1365,7 +1365,7 @@ exports[`InputSwitch component tests checked - true, danger - false, disabled -
       }
       jestInlineStyle={
         {
-          "backgroundColor": ""#ffffff"",
+          "backgroundColor": ""#85888e"",
           "borderRadius": 1600,
           "height": 16,
           "left": "19",
@@ -1377,7 +1377,7 @@ exports[`InputSwitch component tests checked - true, danger - false, disabled -
       style={
         [
           {
-            "backgroundColor": "#ffffff",
+            "backgroundColor": "#85888e",
             "borderRadius": 1600,
             "height": 16,
             "left": 19,
@@ -1713,7 +1713,7 @@ exports[`InputSwitch component tests checked - true, danger - true, disabled - t
       }
       jestInlineStyle={
         {
-          "backgroundColor": ""#ffffff"",
+          "backgroundColor": ""#85888e"",
           "borderRadius": 1600,
           "height": 16,
           "left": "19",
@@ -1725,7 +1725,7 @@ exports[`InputSwitch component tests checked - true, danger - true, disabled - t
       style={
         [
           {
-            "backgroundColor": "#ffffff",
+            "backgroundColor": "#85888e",
             "borderRadius": 1600,
             "height": 16,
             "left": 19,
@@ -1829,7 +1829,7 @@ exports[`InputSwitch component tests checked - true, danger - true, disabled - t
       }
       jestInlineStyle={
         {
-          "backgroundColor": ""#ffffff"",
+          "backgroundColor": ""#85888e"",
           "borderRadius": 1600,
           "height": 16,
           "left": "19",
@@ -1841,7 +1841,7 @@ exports[`InputSwitch component tests checked - true, danger - true, disabled - t
       style={
         [
           {
-            "backgroundColor": "#ffffff",
+            "backgroundColor": "#85888e",
             "borderRadius": 1600,
             "height": 16,
             "left": 19,
diff --git a/src/components/Input/InputSwitch/styles/useHandleStyles.ts b/src/components/Input/InputSwitch/styles/useHandleStyles.ts
index 93287f19..bf7e4e68 100644
--- a/src/components/Input/InputSwitch/styles/useHandleStyles.ts
+++ b/src/components/Input/InputSwitch/styles/useHandleStyles.ts
@@ -4,7 +4,7 @@ import { useSharedValue, withTiming } from 'react-native-reanimated'
 
 import { StyleSheet } from 'react-native-unistyles'
 
-export const useHandleStyles = (checked: boolean) => {
+export const useHandleStyles = (checked: boolean, disabled: boolean) => {
   const styles = handleStyles
   const handleOnLeft = styles.handleOn.left
   const handleOffLeft = styles.handleOff.left
@@ -15,23 +15,39 @@ export const useHandleStyles = (checked: boolean) => {
   )
 
   const calculateHandleBackground = useCallback(
-    (checked: boolean) =>
-      checked ? styles.handleOn.backgroundColor : styles.handle.backgroundColor,
-    [styles.handle.backgroundColor, styles.handleOn.backgroundColor]
+    (checked: boolean, disabled: boolean) => {
+      if (disabled) {
+        return styles.handleDisabled.backgroundColor
+      }
+
+      return checked
+        ? styles.handleOn.backgroundColor
+        : styles.handle.backgroundColor
+    },
+    [
+      styles.handle.backgroundColor,
+      styles.handleDisabled.backgroundColor,
+      styles.handleOn.backgroundColor,
+    ]
   )
 
   const handleLeftPosition = useSharedValue(
     calculateHandleLeftPosition(checked)
   )
-  const handleBackground = useSharedValue(calculateHandleBackground(checked))
+  const handleBackground = useSharedValue(
+    calculateHandleBackground(checked, disabled)
+  )
 
   useEffect(() => {
     handleLeftPosition.value = withTiming(calculateHandleLeftPosition(checked))
-    handleBackground.value = withTiming(calculateHandleBackground(checked))
+    handleBackground.value = withTiming(
+      calculateHandleBackground(checked, disabled)
+    )
   }, [
     calculateHandleBackground,
     calculateHandleLeftPosition,
     checked,
+    disabled,
     handleLeftPosition,
     handleBackground,
   ])
@@ -63,6 +79,10 @@ const handleStyles = StyleSheet.create(({ components: { toggleswitch } }) => ({
     left: toggleswitch.root.gap - toggleswitch.root.borderWidth,
   },
 
+  handleDisabled: {
+    backgroundColor: toggleswitch.colorScheme.handle.disabledBackground,
+  },
+
   handleOn: {
     backgroundColor: toggleswitch.colorScheme.handle.checkedBackground,
     left:
diff --git a/src/theme/tokens/components/dark.json b/src/theme/tokens/components/dark.json
index 3bef7b42..9188a2af 100644
--- a/src/theme/tokens/components/dark.json
+++ b/src/theme/tokens/components/dark.json
@@ -2801,21 +2801,21 @@
   "toggleswitch": {
     "colorScheme": {
       "handle": {
-        "background": "#56595f",
-        "checkedBackground": "#56595f",
+        "background": "#ffffff",
+        "checkedBackground": "#181a1f",
         "checkedColor": "#2b2e33",
-        "checkedHoverBackground": "#56595f",
+        "checkedHoverBackground": "#181a1f",
         "checkedHoverColor": "#2b2e33",
         "color": "#2b2e33",
         "disabledBackground": "#85888e",
-        "hoverBackground": "#56595f",
+        "hoverBackground": "#ffffff",
         "hoverColor": "#2b2e33"
       },
       "root": {
         "background": "#6d7076",
-        "checkedBackground": "#2b2e33",
-        "checkedHoverBackground": "#404348",
-        "disabledBackground": "#e2e2e4",
+        "checkedBackground": "#f0f0f1",
+        "checkedHoverBackground": "#e2e2e4",
+        "disabledBackground": "#404348",
         "hoverBackground": "#85888e"
       }
     },