diff --git a/src/Umbraco.Web.UI.Client/src/apps/backoffice/components/backoffice-header-logo.element.ts b/src/Umbraco.Web.UI.Client/src/apps/backoffice/components/backoffice-header-logo.element.ts
index bfd25e2dfcdd..a554bb69c932 100644
--- a/src/Umbraco.Web.UI.Client/src/apps/backoffice/components/backoffice-header-logo.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/apps/backoffice/components/backoffice-header-logo.element.ts
@@ -124,11 +124,15 @@ export class UmbBackofficeHeaderLogoElement extends UmbLitElement {
 			#header-logo-button {
 				--uui-button-padding-top-factor: 1;
 				--uui-button-padding-bottom-factor: 0.5;
-				--uui-button-background-color: transparent;
+				
 				display: var(--umb-header-logo-display, inline);
 				margin: var(--umb-header-logo-margin, 0 var(--uui-size-space-2) 0 0);
 			}
 
+			#header-logo-button:hover{
+				--uui-button-background-color-hover: transparent;
+			}
+				
 			#header-logo > img {
 				width: var(--umb-header-logo-width, auto);
 				height: var(--umb-header-logo-height, 30px);
diff --git a/src/Umbraco.Web.UI.Client/src/packages/core/components/header-app/header-app-button.element.ts b/src/Umbraco.Web.UI.Client/src/packages/core/components/header-app/header-app-button.element.ts
index 08192ae10771..45c6414bc45d 100644
--- a/src/Umbraco.Web.UI.Client/src/packages/core/components/header-app/header-app-button.element.ts
+++ b/src/Umbraco.Web.UI.Client/src/packages/core/components/header-app/header-app-button.element.ts
@@ -44,6 +44,9 @@ export class UmbHeaderAppButtonElement extends UmbLitElement {
 					var(--uui-color-emphasis)
 				);
 			}
+			uui-button:hover{
+				--uui-button-background-color-hover: transparent;
+			}
 		`,
 	];
 }