diff --git a/assets/scss/animations.scss b/assets/scss/animations.scss
index 93b6a7a..047d563 100644
--- a/assets/scss/animations.scss
+++ b/assets/scss/animations.scss
@@ -23,6 +23,19 @@
   }
 }
 
+@keyframes mini-bounce {
+  $baseSize: 0.5em;
+  $baseRotation: 2deg;
+  from {
+    transform: rotate($baseRotation) translateX($baseSize)
+      translateY(-#{$baseSize / 5});
+  }
+  to {
+    transform: rotate(-$baseRotation) translateX(-$baseSize)
+      translateY(-#{$baseSize / 5});
+  }
+}
+
 @keyframes pulse {
   from {
     width: #{$tooltip-size / 2};
@@ -38,6 +51,12 @@
   @for $i from 1 to length($colorOrder) {
     #{$i * $divide}% {
       fill: var(--base#{nth($colorOrder, $i)});
+      color: var(--base#{nth($colorOrder, $i)});
     }
   }
 }
+
+@keyframes blur-blur {
+  from { filter: blur(1em); }
+  to { filter: blur(0); }
+}
diff --git a/assets/scss/roles.scss b/assets/scss/roles.scss
index a65b989..53d763b 100644
--- a/assets/scss/roles.scss
+++ b/assets/scss/roles.scss
@@ -23,8 +23,28 @@
   animation: extreme-shake 0.1s alternate ease-in-out infinite;
 }
 
+.blur {
+  filter: blur(4px);
+}
+
+.blur-blur {
+  animation: blur-blur 4s alternate infinite;
+}
+
+.rainbow {
+  animation: rainbow 5s infinite;
+}
+
+.bounce {
+  animation: bounce 0.6s alternate ease-in-out infinite;
+}
+
+.mini-bounce {
+  animation: mini-bounce 0.6s alternate ease-in-out infinite;
+}
+
 @media (prefers-reduced-motion) {
-  .shake, .extreme-shake {
+  .shake, .extreme-shake, .blur-blur, .bounce {
     animation: none;
   }
 }