diff --git a/src/animations/preloader.ts b/src/animations/preloader.ts
index 3cec66c..a6aa20e 100644
--- a/src/animations/preloader.ts
+++ b/src/animations/preloader.ts
@@ -25,6 +25,11 @@ const PreloaderAnimation = (elements: gsap.TweenTarget[]) => {
 			},
 			"-=0.8"
 		)
+		.eventCallback("onStart", () => {
+			gsap.set("[data-name]", {
+				opacity: 0,
+			});
+		})
 		.eventCallback("onComplete", () => {
 			gsap.set("#banner", {
 				yPercent: 100,
@@ -32,6 +37,9 @@ const PreloaderAnimation = (elements: gsap.TweenTarget[]) => {
 			gsap.set(".hidden-init", {
 				visibility: "hidden",
 			});
+			gsap.set("[data-name]", {
+				opacity: 1,
+			});
 			preloader.kill();
 		});
 
diff --git a/src/index.scss b/src/index.scss
index e45fdca..b4ed9f3 100644
--- a/src/index.scss
+++ b/src/index.scss
@@ -56,6 +56,10 @@
 	box-sizing: border-box;
 }
 
+html {
+	background: #000;
+}
+
 html[data-scroll-direction] {
 	overflow: hidden;
 	position: fixed;