diff --git a/packages/frontend/src/ui/deck.vue b/packages/frontend/src/ui/deck.vue
index 461396daf..4708012ba 100644
--- a/packages/frontend/src/ui/deck.vue
+++ b/packages/frontend/src/ui/deck.vue
@@ -389,21 +389,25 @@ async function deleteProfile() {
 	color: var(--fg);
 
 	&:hover {
-		background: var(--X2);
+		background: var(--panelHighlight);
 	}
 
-	&:disabled {
-		cursor: default;
-
-		> .navButtonIcon {
-			opacity: 0.5;
-		}
+	&:active {
+		background: var(--X2);
 	}
 }
 
 .postButton {
 	background: linear-gradient(90deg, var(--buttonGradateA), var(--buttonGradateB));
 	color: var(--fgOnAccent);
+
+	&:hover {
+		background: linear-gradient(90deg, var(--X8), var(--X8));
+	}
+
+	&:active {
+		background: linear-gradient(90deg, var(--X8), var(--X8));
+	}
 }
 
 .navButtonIcon {
diff --git a/packages/frontend/src/ui/universal.vue b/packages/frontend/src/ui/universal.vue
index 00e65ebee..67071d804 100644
--- a/packages/frontend/src/ui/universal.vue
+++ b/packages/frontend/src/ui/universal.vue
@@ -337,21 +337,25 @@ $widgets-hide-threshold: 1090px;
 	color: var(--fg);
 
 	&:hover {
-		background: var(--X2);
+		background: var(--panelHighlight);
 	}
 
-	&:disabled {
-		cursor: default;
-
-		> .navButtonIcon {
-			opacity: 0.5;
-		}
+	&:active {
+		background: var(--X2);
 	}
 }
 
 .postButton {
 	background: linear-gradient(90deg, var(--buttonGradateA), var(--buttonGradateB));
 	color: var(--fgOnAccent);
+
+	&:hover {
+		background: linear-gradient(90deg, var(--X8), var(--X8));
+	}
+
+	&:active {
+		background: linear-gradient(90deg, var(--X8), var(--X8));
+	}
 }
 
 .navButtonIcon {