diff --git a/src/components/Topbar/Topbar.css b/src/components/Topbar/Topbar.css
index ae2a3c98..107ab415 100644
--- a/src/components/Topbar/Topbar.css
+++ b/src/components/Topbar/Topbar.css
@@ -99,6 +99,21 @@
   /* Style: red dot with white border */
   background-color: var(--failColor);
   border: 2px solid var(--matterColorLight);
+
+  animation-name: notificationPop;
+  animation-duration: 0.1s;
+  animation-delay: 0.1s;
+  animation-fill-mode: forwards;
+
+  animation-timing-function: ease-in;
+  opacity: 0;
+  transform: scale(0);
+}
+
+
+@keyframes notificationPop {
+    0%   {transform: scale(0); opacity: 0;}
+    100% {transform: scale(1); opacity: 1;}
 }
 
 .desktop {
diff --git a/src/components/TopbarDesktop/TopbarDesktop.css b/src/components/TopbarDesktop/TopbarDesktop.css
index dd367ce5..16158239 100644
--- a/src/components/TopbarDesktop/TopbarDesktop.css
+++ b/src/components/TopbarDesktop/TopbarDesktop.css
@@ -160,6 +160,21 @@
 
   /* Style: red dot */
   background-color: var(--failColor);
+
+  animation-name: notificationPop;
+  animation-duration: 0.1s;
+  animation-delay: 0.1s;
+  animation-fill-mode: forwards;
+
+  animation-timing-function: ease-in;
+  opacity: 0;
+  transform: scale(0);
+}
+
+
+@keyframes notificationPop {
+    0%   {transform: scale(0); opacity: 0;}
+    100% {transform: scale(1); opacity: 1;}
 }
 
 /* Profile menu */