diff --git a/web/pgadmin/browser/server_groups/servers/databases/schemas/synonyms/static/js/synonym.js b/web/pgadmin/browser/server_groups/servers/databases/schemas/synonyms/static/js/synonym.js
index 1731ce3a0..8cb7cbe86 100644
--- a/web/pgadmin/browser/server_groups/servers/databases/schemas/synonyms/static/js/synonym.js
+++ b/web/pgadmin/browser/server_groups/servers/databases/schemas/synonyms/static/js/synonym.js
@@ -182,8 +182,8 @@ define('pgadmin.node.synonym', [
         },{
           id: 'is_public_synonym', label: gettext('Public synonym?'),
           type: 'switch', mode: ['properties'], cell: 'switch',
-          options: { onText: gettext('Yes'), offText: gettext('No'), onColor: 'success',
-            offColor: 'ternary', size: 'mini'},
+          options: { onText: gettext('Yes'), offText: gettext('No'), onColor: 'switch-primary',
+            offColor: 'switch-ternary', size: 'mini'},
         },
         ],
         validate: function() {
diff --git a/web/pgadmin/browser/server_groups/servers/databases/schemas/tables/columns/static/js/column.js b/web/pgadmin/browser/server_groups/servers/databases/schemas/tables/columns/static/js/column.js
index cef365d7d..51c43b7ad 100644
--- a/web/pgadmin/browser/server_groups/servers/databases/schemas/tables/columns/static/js/column.js
+++ b/web/pgadmin/browser/server_groups/servers/databases/schemas/tables/columns/static/js/column.js
@@ -219,7 +219,7 @@ define('pgadmin.node.column', [
           deps:['name'], cellHeaderClasses:'width_percent_5',
           options: {
             onText: gettext('Yes'), offText: gettext('No'),
-            onColor: 'success', offColor: 'ternary',
+            onColor: 'switch-primary', offColor: 'switch-ternary',
           },
           visible: function(m) {
             return _.isUndefined(
@@ -524,7 +524,7 @@ define('pgadmin.node.column', [
           id: 'attnotnull', label: gettext('Not NULL?'), cell: 'switch',
           type: 'switch', cellHeaderClasses:'width_percent_20',
           group: gettext('Constraints'), editable: 'editable_check_for_table',
-          options: { onText: gettext('Yes'), offText: gettext('No'), onColor: 'success', offColor: 'ternary' },
+          options: { onText: gettext('Yes'), offText: gettext('No'), onColor: 'switch-primary', offColor: 'switch-ternary' },
           deps: ['colconstype'],
           disabled: function(m) {
             if (m.get('colconstype') == 'i') {
diff --git a/web/pgadmin/misc/statistics/static/js/statistics.js b/web/pgadmin/misc/statistics/static/js/statistics.js
index 657d47463..0fb6360e0 100644
--- a/web/pgadmin/misc/statistics/static/js/statistics.js
+++ b/web/pgadmin/misc/statistics/static/js/statistics.js
@@ -102,8 +102,8 @@ define('misc.statistics', [
     PGBooleanCell.prototype.defaults.options, {
       onText: gettext('True'),
       offText: gettext('False'),
-      onColor: 'success',
-      offColor: 'ternary',
+      onColor: 'switch-primary',
+      offColor: 'switch-ternary',
       size: 'mini',
     }
   );
diff --git a/web/pgadmin/preferences/static/js/preferences.js b/web/pgadmin/preferences/static/js/preferences.js
index 7e097233e..a9254b319 100644
--- a/web/pgadmin/preferences/static/js/preferences.js
+++ b/web/pgadmin/preferences/static/js/preferences.js
@@ -213,8 +213,8 @@ define('pgadmin.preferences', [
               p.options = {
                 onText: gettext('True'),
                 offText: gettext('False'),
-                onColor: 'success',
-                offColor: 'ternary',
+                onColor: 'switch-primary',
+                offColor: 'switch-ternary',
                 size: 'mini',
               };
               return 'switch';
@@ -222,8 +222,8 @@ define('pgadmin.preferences', [
               p.options = {
                 onText: gettext('Show'),
                 offText: gettext('Hide'),
-                onColor: 'success',
-                offColor: 'ternary',
+                onColor: 'switch-primary',
+                offColor: 'switch-ternary',
                 size: 'mini',
                 width: '56',
               };
diff --git a/web/pgadmin/static/js/backform.pgadmin.js b/web/pgadmin/static/js/backform.pgadmin.js
index a1c898890..c37ee7b1f 100644
--- a/web/pgadmin/static/js/backform.pgadmin.js
+++ b/web/pgadmin/static/js/backform.pgadmin.js
@@ -567,8 +567,8 @@ define([
       options: {
         onText: gettext('Yes'),
         offText: gettext('No'),
-        onColor: 'success',
-        offColor: 'ternary',
+        onColor: 'switch-primary',
+        offColor: 'switch-ternary',
         size: 'mini',
         width: null,
         height: null,
diff --git a/web/pgadmin/static/js/backgrid.pgadmin.js b/web/pgadmin/static/js/backgrid.pgadmin.js
index e82da8bec..9bb4ed55a 100644
--- a/web/pgadmin/static/js/backgrid.pgadmin.js
+++ b/web/pgadmin/static/js/backgrid.pgadmin.js
@@ -624,8 +624,8 @@ define([
       options: _.defaults({
         onText: gettext('Yes'),
         offText: gettext('No'),
-        onColor: 'success',
-        offColor: 'ternary',
+        onColor: 'switch-primary',
+        offColor: 'switch-ternary',
         size: 'mini',
         width: null,
         height: null,
diff --git a/web/pgadmin/static/scss/_bootstrap.overrides.scss b/web/pgadmin/static/scss/_bootstrap.overrides.scss
index c09465d60..bc13794ef 100644
--- a/web/pgadmin/static/scss/_bootstrap.overrides.scss
+++ b/web/pgadmin/static/scss/_bootstrap.overrides.scss
@@ -111,6 +111,14 @@ legend {
 	@include button-variant($color-ternary, $btn-ternary-border, $btn-ternary-hover-bg);
 }
 
+.btn-switch-primary {
+    @include button-variant($color-switch-primary, $btn-switch-primary-border, $btn-switch-primary-hover-bg);
+}
+
+.btn-switch-ternary {
+    @include button-variant($color-switch-ternary, $btn-switch-ternary-border, $btn-switch-ternary-hover-bg);
+}
+
 .form-group fieldset {
 	background-color: $color-gray-lighter;
 	border-color: $color-gray-lighter;
diff --git a/web/pgadmin/static/scss/resources/_default.variables.scss b/web/pgadmin/static/scss/resources/_default.variables.scss
index 14db912f0..fc7ad0595 100644
--- a/web/pgadmin/static/scss/resources/_default.variables.scss
+++ b/web/pgadmin/static/scss/resources/_default.variables.scss
@@ -276,3 +276,12 @@ $schemadiff-target-row-color: #fbe3bf !default;
 $custom-forms-transition: none;
 $custom-control-indicator-focus-border-color: $input-focus-border-color;
 $custom-control-indicator-border-color: $input-border-color;
+
+/* Switch control */
+$color-switch-primary: #43a047 !default;
+$btn-switch-primary-border: $color-switch-primary !default;
+$btn-switch-primary-hover-bg: darken($color-switch-primary, 7.5%) !default;
+
+$color-switch-ternary: #6b6b6b !default;
+$btn-switch-ternary-border: $color-switch-ternary !default;
+$btn-switch-ternary-hover-bg: darken($color-switch-ternary, 7.5%) !default;
diff --git a/web/pgadmin/static/scss/resources/dark/_theme.variables.scss b/web/pgadmin/static/scss/resources/dark/_theme.variables.scss
index e82640eba..f713ef86d 100644
--- a/web/pgadmin/static/scss/resources/dark/_theme.variables.scss
+++ b/web/pgadmin/static/scss/resources/dark/_theme.variables.scss
@@ -79,3 +79,5 @@ $loader-icon-small: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='ut
 $schemadiff-diff-row-color: #807a48 !default;
 $schemadiff-source-row-color: #402025 !default;
 $schemadiff-target-row-color: #6b5438 !default;
+
+$color-switch-ternary: #646464 !default;