diff --git a/js/nav.footer.js b/js/nav.footer.js
index c84dc3c..74dd3cc 100644
--- a/js/nav.footer.js
+++ b/js/nav.footer.js
@@ -61,14 +61,22 @@ const footer = `
 			async
 		></script>
 		<div class="social-icons">
-			<a href="https://github.com/ChromeGaming/Dot-Box" target="_blank">
+			<a href="https://github.com/ChromeGaming/Dot-Box" class="social" target="_blank">
 				<i class="fab fa-github"></i>
 			</a>
-			<a href="https://discord.gg/2HTCFrSvPB" target="_blank">
+			<a href="https://discord.gg/2HTCFrSvPB" class="social" target="_blank">
 				<i class="fab fa-discord"></i>
 			</a>
 		</div>
 	</div>
+	<style>
+		.author .social-icons .social:hover .fa-github{
+			color: #2b3137;
+		}
+		.author .social-icons .social:hover .fa-discord{
+			color: #7289da;
+		}
+	</style>
 `;
 
 document.addEventListener("DOMContentLoaded", () => {
diff --git a/styles/mainstyle.css b/styles/mainstyle.css
index 08670e5..65722b8 100644
--- a/styles/mainstyle.css
+++ b/styles/mainstyle.css
@@ -830,4 +830,12 @@ input[type="number"] {
 
 .hidden {
 	display: none;
+}
+
+
+.author .social-icons .social:hover .fa-github{
+	color: #2b3137;
+}
+.author .social-icons .social:hover .fa-discord{
+	color: #7289da;
 }
\ No newline at end of file