diff --git a/src/components/color-picker/color-picker.tsx b/src/components/color-picker/color-picker.tsx
index 63636dbe..a86366a2 100644
--- a/src/components/color-picker/color-picker.tsx
+++ b/src/components/color-picker/color-picker.tsx
@@ -131,7 +131,6 @@ export class ColorPicker {
     this.handleAlphaInput = this.handleAlphaInput.bind(this);
     this.handleAlphaKeyDown = this.handleAlphaKeyDown.bind(this);
     this.handleCopy = this.handleCopy.bind(this);
-    this.handleDocumentKeyDown = this.handleDocumentKeyDown.bind(this);
     this.handleDocumentMouseDown = this.handleDocumentMouseDown.bind(this);
     this.handleDrag = this.handleDrag.bind(this);
     this.handleDropdownAfterHide = this.handleDropdownAfterHide.bind(this);
@@ -362,22 +361,6 @@ export class ColorPicker {
     }
   }
 
-  handleDocumentKeyDown(event: KeyboardEvent) {
-    // Close when pressing escape or tab
-    if (event.key === 'Escape') {
-      this.dropdown.hide();
-    }
-
-    // Close when tabbing out of the color picker
-    if (event.key === 'Tab') {
-      setTimeout(() => {
-        if (document.activeElement && document.activeElement.closest('sl-color-picker') !== this.host) {
-          this.dropdown.hide();
-        }
-      });
-    }
-  }
-
   handleDocumentMouseDown(event: MouseEvent) {
     const target = event.target as HTMLElement;