diff --git a/pages/index.jsx b/pages/index.jsx
index 67d6e270..87740ae9 100644
--- a/pages/index.jsx
+++ b/pages/index.jsx
@@ -1,11 +1,6 @@
 import { Fragment, useState } from "react";
 import { LandingLayout } from "@/layout";
-import { LandingPage } from "@/containers";
-
-// Import your images or replace with actual image URLs
-import usernameIcon from "./path/to/username-icon.png";
-import passwordIcon from "./path/to/password-icon.png";
-
+import Image from "next/image";
 function Login() {
   const [username, setUsername] = useState("");
   const [password, setPassword] = useState("");
@@ -14,7 +9,6 @@ function Login() {
     e.preventDefault();
     console.log("Username:", username);
     console.log("Password:", password);
-    // Add your authentication logic here
   };
 
   return (
@@ -24,7 +18,12 @@ function Login() {
           <h2>Login</h2>
           <form className="login-form" onSubmit={handleSubmit}>
             <label className="form-label">
-              <img src={usernameIcon} alt="Username" className="input-icon" />
+              <Image
+                src="/login/username.png"
+                alt="Username"
+                height={20}
+                width={20}
+              ></Image>
               Username:
               <input
                 type="text"
@@ -36,7 +35,12 @@ function Login() {
             </label>
             <br />
             <label className="form-label">
-              <img src={passwordIcon} alt="Password" className="input-icon" />
+              <Image
+                src="/login/password.png"
+                alt="Password"
+                height={20}
+                width={20}
+              ></Image>
               Password:
               <input
                 type="password"