diff --git a/packages/gui/src/components/FooterLinks/FooterLinks.svelte b/packages/gui/src/components/FooterLinks/FooterLinks.svelte
index 9ee93e2..68a121d 100644
--- a/packages/gui/src/components/FooterLinks/FooterLinks.svelte
+++ b/packages/gui/src/components/FooterLinks/FooterLinks.svelte
@@ -5,15 +5,18 @@
 				<h3 class="mb-5 text-4xl text-primary">
 					Changing the way you build. And what happens after you build it.
 				</h3>
-				<p>
+				<p class="mb-5">
 					tea.cli is a delightful package manager that gets out of your way and sets you up for a
 					joyful development process. You can install it today. Our web3 protocol will create an OSS
 					ecosystem that is safer for all users, and fair for all maintainers. Read our white paper
 					here.
 				</p>
+				<div class="w-3/4">
+					<img src="/static/images/footer-grid-element.svg" />
+				</div>
 			</div>
 
-			<div class="card social-box w-1/4 border-2 border-gray">
+			<div class="card social-box w-1/4 h-full border-2 border-gray">
 				<ul class="list-group list-group-flush">
 					<div class="border-b border-gray p-3">
 						<a class="list-group-item" role="button" href="https://twitter.com/teaxyz"
@@ -35,15 +38,40 @@
 							><i class="icon-reddit social-icon mr-3" />Reddit</a
 						>
 					</div>
-					<div class="border-b border-gray p-3">
+					<div class="p-3">
 						<a class="list-group-item" role="button" href="https://t.me/tea_xyz"
 							><i class="icon-telegram social-icon mr-3" />Telegram</a
 						>
 					</div>
 				</ul>
 			</div>
+
 		</div>
 	</section>
 
 	<section class="h-16 border border-r-0 border-gray p-4 px-16" />
 </footer>
+
+<style>
+
+	h3{
+	  font-family: "pp-neue-machina", sans-serif;
+	  color:#00ffd0;
+	}
+
+	p{
+	  font-family: "sono", sans-serif;
+	  color: #ffffff;
+	}
+
+	.list-group-item{
+		font-family: "pp-neue-machina", sans-serif;
+		text-transform: uppercase;
+		transition: 0.1s ease-in;
+	}
+
+	.list-group-item:hover{
+		padding-left: 1vw;
+	}
+
+</style>