diff --git a/public/css/character-group-overlay.css b/public/css/character-group-overlay.css
index dbe02014a..e8709c4f4 100644
--- a/public/css/character-group-overlay.css
+++ b/public/css/character-group-overlay.css
@@ -61,3 +61,7 @@
 #character_context_menu li:hover {
     background-color: var(--SmartThemeBotMesBlurTintColor);
 }
+
+#bulkEditButton.bulk_edit_overlay_active {
+    color: var(--golden);
+}
diff --git a/public/scripts/BulkEditOverlay.js b/public/scripts/BulkEditOverlay.js
index 890f0d379..611efb07a 100644
--- a/public/scripts/BulkEditOverlay.js
+++ b/public/scripts/BulkEditOverlay.js
@@ -347,12 +347,14 @@ class BulkEditOverlay {
                 this.#enableClickEventsForCharacters();
                 this.clearSelectedCharacters();
                 this.disableContextMenu();
+                this.#disableBulkEditButtonHighlight();
                 CharacterContextMenu.hide();
                 break;
             case CharacterGroupOverlayState.select:
                 this.container.classList.add(BulkEditOverlay.selectModeClass);
                 this.#disableClickEventsForCharacters();
                 this.enableContextMenu();
+                this.#enableBulkEditButtonHighlight();
                 break;
         }
 
@@ -365,6 +367,10 @@ class BulkEditOverlay {
     #disableClickEventsForCharacters = () => [...this.container.getElementsByClassName(BulkEditOverlay.characterClass)]
         .forEach(element => element.addEventListener('click', this.toggleCharacterSelected));
 
+    #enableBulkEditButtonHighlight = () => document.getElementById('bulkEditButton').classList.add('bulk_edit_overlay_active');
+
+    #disableBulkEditButtonHighlight = () => document.getElementById('bulkEditButton').classList.remove('bulk_edit_overlay_active');
+
     toggleCharacterSelected = event => {
         event.stopPropagation();