diff --git a/app/soapbox/components/primary_navigation.js b/app/soapbox/components/primary_navigation.js
index eb7efbe3c6..3b358cb719 100644
Binary files a/app/soapbox/components/primary_navigation.js and b/app/soapbox/components/primary_navigation.js differ
diff --git a/app/soapbox/components/thumb_navigation.js b/app/soapbox/components/thumb_navigation.js
index 64ba0206a4..eea799e345 100644
Binary files a/app/soapbox/components/thumb_navigation.js and b/app/soapbox/components/thumb_navigation.js differ
diff --git a/app/styles/components/icon.scss b/app/styles/components/icon.scss
index ebfed91c4d..2ffa232417 100644
--- a/app/styles/components/icon.scss
+++ b/app/styles/components/icon.scss
@@ -4,11 +4,13 @@
   display: flex;
   align-items: center;
   justify-content: center;
+  transition: 0.2s;
 
   svg {
     // Apparently this won't skew the image as long as it has a viewbox
     width: 100%;
     height: 100%;
+    transition: 0.2s;
   }
 
   &--active {
@@ -39,6 +41,12 @@
       }
     }
   }
+
+  &--unread {
+    svg.icon-tabler-bell {
+      transform: rotate(45deg);
+    }
+  }
 }
 
 .icon-button > div {