diff --git a/packages/gui/src/components/FooterLinks/FooterLinks.svelte b/packages/gui/src/components/FooterLinks/FooterLinks.svelte
index 83278c6..9bc56ef 100644
--- a/packages/gui/src/components/FooterLinks/FooterLinks.svelte
+++ b/packages/gui/src/components/FooterLinks/FooterLinks.svelte
@@ -1,8 +1,97 @@
 <footer class="h-autofont-machina relative w-full bg-black">
-	<section class="h-56 p-4 px-16">
-		<a class="text-xl text-primary" href="/"> Quick Links (TBD) </a>
+	<section class="p-4 px-16 py-16">
+		<div class="flex">
+			<div class="footer-text w-3/4 pr-16">
+				<h3 class="mb-5 text-4xl text-primary">
+					Changing the way you build. And what happens after you build it.
+				</h3>
+				<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 h-full w-1/4 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"
+							><i class="icon-twitter social-icon mr-3" />Twitter</a
+						>
+					</div>
+					<div class="border-b border-gray p-3">
+						<a class="list-group-item" role="button" href="https://discord.gg/KCZsXfJphn"
+							><i class="icon-discord social-icon mr-3" />Discord</a
+						>
+					</div>
+					<div class="border-b border-gray p-3">
+						<a class="list-group-item" role="button" href="https://github.com/teaxyz"
+							><i class="icon-github social-icon mr-3" />GitHub</a
+						>
+					</div>
+					<div class="border-b border-gray p-3">
+						<a class="list-group-item" role="button" href="https://reddit.com/r/teaxyz"
+							><i class="icon-reddit social-icon mr-3" />Reddit</a
+						>
+					</div>
+					<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">
-		<a class="text-sm text-primary" href="/"> terms and services </a>
+		<div class="flex">
+			<div class="w-1/2 pt-2">
+				<p class="text-xs">
+					©2022 tea inc. You can also share our <a href="https://linktr.ee/teaxyz">Linktree</a>.
+				</p>
+			</div>
+			<div class="flex w-1/2 pt-2">
+				<ul class="nav ml-auto flex text-xs">
+					<li class="nav-item mr-3 ">
+						<a class="nav-link footer-link small" href="https://tea.xyz/privacy-policy/"
+							>Privacy Policy</a
+						>
+					</li>
+					<li class="nav-item">
+						<a class="nav-link footer-link small" href="https://tea.xyz/terms-of-use/"
+							>Terms of Use</a
+						>
+					</li>
+				</ul>
+			</div>
+		</div>
 	</section>
 </footer>
+
+<style>
+	h3 {
+		font-family: 'pp-neue-machina', sans-serif;
+		color: #00ffd0;
+	}
+
+	p,
+	.nav-item {
+		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>