diff --git a/_locales/en/messages.json b/_locales/en/messages.json
index 584b7f1a..f019c47e 100644
--- a/_locales/en/messages.json
+++ b/_locales/en/messages.json
@@ -176,7 +176,7 @@
     "description": "Label for the style editor's CSS theme."
   },
   "colorpickerSwitchFormatTooltip": {
-    "message": "Switch formats: HEX -> RGB -> HSL.\nShift-click to reverse the direction.\nAlso via PgUp (PageUp), PgDn (PageDown), Tab keys.",
+    "message": "Switch formats: HEX -> RGB -> HSL.\nShift-click to reverse the direction.\nAlso via PgUp (PageUp), PgDn (PageDown) keys.",
     "description": "Tooltip for the switch button in the color picker popup in the style editor."
   },
   "colorpickerTooltip": {
diff --git a/vendor-overwrites/colorpicker/colorpicker.js b/vendor-overwrites/colorpicker/colorpicker.js
index 29adf78b..834cd313 100644
--- a/vendor-overwrites/colorpicker/colorpicker.js
+++ b/vendor-overwrites/colorpicker/colorpicker.js
@@ -346,12 +346,17 @@ CodeMirror.defineExtension('colorpicker', function () {
         if (!ctrl && !alt && !meta) {
           const el = document.activeElement;
           const inputs = $inputs[currentFormat];
-          if (which !== 9 && !shift ||
-              el === inputs[0] && shift ||
-              el === inputs[inputs.length - 1] && !shift) {
-            event.preventDefault();
+          const lastInput = inputs[inputs.length - 1];
+          if (which === 9 && shift && el === inputs[0]) {
+            lastInput.focus();
+          } else if (which === 9 && !shift && el === lastInput) {
+            inputs[0].focus();
+          } else if (which !== 9 && !shift) {
             setFromFormatElement({shift: which === 33 || shift});
+          } else {
+            return;
           }
+          event.preventDefault();
         }
         return;
       case 38: // Up