diff --git a/core/src/components/AppMenu.vue b/core/src/components/AppMenu.vue
index b7b5b8bd4562a..6f65f185a4dab 100644
--- a/core/src/components/AppMenu.vue
+++ b/core/src/components/AppMenu.vue
@@ -146,7 +146,6 @@ $header-icon-size: 20px;
 		height: 50px;
 		position: relative;
 		display: flex;
-		filter: var(--background-image-invert-if-bright);
 
 		&.app-menu-entry__active {
 			opacity: 1;
@@ -187,6 +186,7 @@ $header-icon-size: 20px;
 			height: $header-icon-size;
 			padding: calc((100% - $header-icon-size) / 2);
 			box-sizing: content-box;
+			filter: var(--background-image-invert-if-bright);
 		}
 
 		.app-menu-entry--label {
diff --git a/cypress/e2e/theming/admin-settings.cy.ts b/cypress/e2e/theming/admin-settings.cy.ts
index 4736ace9e4d6f..63242d64f1bd6 100644
--- a/cypress/e2e/theming/admin-settings.cy.ts
+++ b/cypress/e2e/theming/admin-settings.cy.ts
@@ -167,7 +167,7 @@ describe.only('Remove the default background with a bright color', function() {
 
 	it('See the header being inverted', function() {
 		cy.waitUntil(() => cy.window().then((win) => {
-			const firstEntry = win.document.querySelector('.app-menu-main li')
+			const firstEntry = win.document.querySelector('.app-menu-main li img')
 			if (!firstEntry) {
 				return false
 			}
diff --git a/cypress/e2e/theming/user-background.cy.ts b/cypress/e2e/theming/user-background.cy.ts
index 86b66627ee63f..92617b33b5985 100644
--- a/cypress/e2e/theming/user-background.cy.ts
+++ b/cypress/e2e/theming/user-background.cy.ts
@@ -162,7 +162,7 @@ describe('User select a bright custom color and remove background', function() {
 
 	it('See the header being inverted', function() {
 		cy.waitUntil(() => cy.window().then((win) => {
-			const firstEntry = win.document.querySelector('.app-menu-main li')
+			const firstEntry = win.document.querySelector('.app-menu-main li img')
 			if (!firstEntry) {
 				return false
 			}