diff --git a/src/app.css b/src/app.css
index 8b3786a..c336740 100644
--- a/src/app.css
+++ b/src/app.css
@@ -17,3 +17,7 @@
   font-family: SF Mono, sans-serif;
 }
 
+.dither {
+  background-image: url('dither.gif');
+  background-repeat: repeat;
+}
\ No newline at end of file
diff --git a/src/lib/Feature/Tag/Tag.svelte b/src/lib/Feature/Tag/Tag.svelte
index 8e9c66e..9a8018b 100644
--- a/src/lib/Feature/Tag/Tag.svelte
+++ b/src/lib/Feature/Tag/Tag.svelte
@@ -22,12 +22,8 @@
 <button class={container} on:click={filter}>{tagName}</button>
 
 <style>
-	@keyframes shake {
-  from {background-image:url('dither.png')}
-  to {background-image:url('dither2.png')}
-}
 	button:hover {
-		background-blend-mode: color dodge;
-		animation: shake 0.4s infinite;
-  }
+		background-image: url('dither.gif');
+		background-repeat: repeat;
+	}
 </style>
diff --git a/src/lib/Grid.svelte b/src/lib/Grid.svelte
index 9877262..0b6dc79 100644
--- a/src/lib/Grid.svelte
+++ b/src/lib/Grid.svelte
@@ -22,12 +22,8 @@
 
 
 <style>
-	@keyframes shake {
-  from {background-image:url('dither.png')}
-  to {background-image:url('dither2.png')}
-}
 	img:hover {
-		background-blend-mode: color dodge;
-		animation: shake 0.4s infinite;
+		background-image: url('dither.gif');
+		background-repeat: repeat;
 	}
 </style>
\ No newline at end of file
diff --git a/src/lib/Layout/Filters.svelte b/src/lib/Layout/Filters.svelte
index 1abc601..7e1ea10 100644
--- a/src/lib/Layout/Filters.svelte
+++ b/src/lib/Layout/Filters.svelte
@@ -57,17 +57,8 @@
 </div>
 
 <style>
-	@keyframes shake {
-  from {background-image:url('dither.png')}
-  to {background-image:url('dither2.png')}
-}
 	select:hover {
-		background-blend-mode: color dodge;
-		animation: shake 0.4s infinite;
-	}
-
-	.dither {
-		background-blend-mode: color dodge;
-		animation: shake 0.4s infinite;
+		background-image: url('dither.gif');
+		background-repeat: repeat;
 	}
 </style>
diff --git a/src/lib/Layout/Header.svelte b/src/lib/Layout/Header.svelte
index afa7d02..527ff5d 100644
--- a/src/lib/Layout/Header.svelte
+++ b/src/lib/Layout/Header.svelte
@@ -8,12 +8,9 @@
 <a href="/" class={title} on:click={reset}> Rating Room </a>
 
 <style>
-		@keyframes shake {
-  from {background-image:url('dither.png')}
-  to {background-image:url('dither2.png')}
-}
+
 	a:hover {
-		background-blend-mode: color dodge;
-		animation: shake 0.4s infinite;
+		background-image: url('dither.gif');
+		background-repeat: repeat;
 	}
 </style>
\ No newline at end of file
diff --git a/src/lib/Layout/Products.svelte b/src/lib/Layout/Products.svelte
index 30aab2a..208c7f2 100644
--- a/src/lib/Layout/Products.svelte
+++ b/src/lib/Layout/Products.svelte
@@ -24,13 +24,3 @@
 	{/each}
 </div>
 
-<style>
-		@keyframes shake {
-  from {background-image:url('dither.png')}
-  to {background-image:url('dither2.png')}
-}
-	.dither {
-		background-blend-mode: color dodge;
-		animation: shake 0.4s infinite;
-	}
-</style>
diff --git a/src/lib/Layout/SortOption.svelte b/src/lib/Layout/SortOption.svelte
index 93ee269..90e1a7d 100644
--- a/src/lib/Layout/SortOption.svelte
+++ b/src/lib/Layout/SortOption.svelte
@@ -22,12 +22,8 @@
 </button>
 
 <style>
-	@keyframes shake {
-  from {background-image:url('dither.png')}
-  to {background-image:url('dither2.png')}
-}
 	button:hover {
-		background-blend-mode: color dodge;
-		animation: shake 0.4s infinite;
+		background-image: url('dither.gif');
+		background-repeat: repeat;
 	}
 </style>
diff --git a/static/dither.gif b/static/dither.gif
new file mode 100644
index 0000000..676bb72
Binary files /dev/null and b/static/dither.gif differ
diff --git a/static/dither.png b/static/dither.png
deleted file mode 100644
index 4e37d01..0000000
Binary files a/static/dither.png and /dev/null differ
diff --git a/static/dither2.png b/static/dither2.png
deleted file mode 100644
index 50230e9..0000000
Binary files a/static/dither2.png and /dev/null differ