diff --git a/src/theme.scss b/src/theme.scss
index 189904047..ab83a213e 100644
--- a/src/theme.scss
+++ b/src/theme.scss
@@ -325,6 +325,10 @@ textarea {
 
         &:hover {
             background-color: rgba(0, 0, 0, 0.1) !important;
+
+            & > .grid-item-action {
+                opacity: 1;
+            }
         }
 
         .grid-item-action {
@@ -333,13 +337,18 @@ textarea {
             position: relative;
             float: right;
             margin-bottom: -14px;
-            color: #5e5d5d;
             background-color: unset;
+            opacity: 0;
+            transition: opacity 200ms;
+            color: $text-dark;
 
             &:hover {
-                background-color: rgba(255, 255, 255, 0.3);
                 color: $brand-primary;
             }
+
+            &:active {
+                box-shadow: none;
+            }
         }
 
         .grid-item-top {
@@ -1871,8 +1880,14 @@ tag-input {
         background-color: $backgroundDark;
     }
 
-    .grid-item-content {
-        background-color: $backgroundDark !important;
+    .grid-item {
+        .grid-item-content {
+            background-color: $backgroundDark !important;
+
+            .grid-item-action {
+                color: white;
+            }
+        }
     }
 
     footer, .card, .app-configure-links div.active {