diff --git a/components/nav.templ b/components/nav.templ
index 78a3720..689c054 100644
--- a/components/nav.templ
+++ b/components/nav.templ
@@ -10,7 +10,10 @@ type Link struct {
 }
 
 templ Nav(links []Link) {
-	<section class="flex flex-row justify-between fixed top-0 font-cal w-90% lg:w-80% xl:w-90%">
+	<div aria-hidden="true" class="fixed top-0 w-screen h-20vh bg-transparent bg-gradient-to-b from-black from-20% z-100"></div>
+	<section
+		class="flex flex-row justify-between fixed top-0 font-cal w-90% lg:w-80% xl:w-90% z-110"
+	>
 		<p class="text-gray cannot-hover md:block!">Gustavo "Guz" L. de Mello</p>
 		<p class="text-gray can-hover md:hidden">Guz</p>
 		<nav class="can-hover">
diff --git a/pages/homepage.templ b/pages/homepage.templ
index 36c20f9..ab0b913 100644
--- a/pages/homepage.templ
+++ b/pages/homepage.templ
@@ -79,5 +79,12 @@ templ Homepage() {
 				consectetur et est culpa et culpa duis.
 			</p>
 		</main>
+		<footer>
+			<div
+				aria-hidden="true"
+				class={ "fixed bottom-0 left-0 w-screen h-50vh " +
+				"bg-transparent bg-gradient-to-t from-black from-10%" }
+			></div>
+		</footer>
 	}
 }