Input:-

<!doctype html>
<html>
<title>Priyanshu|Login Form</title>
<head>
<div class="screen">
<center><br>
<div class="box">
<img src="E:\my all tools\app coding items\wallpapers and logos\user2.png" alt="" class="logo">
<h1 class="login">
Login
</h1>
<input type="text" placeholder="Username" class="name">
<input type="password" placeholder="Password" class="name">
<p>Forgot Your Password?</p>
<input type="button" value="Login" class="submit">
<p>Or Login With</p><a href="#">
<input type="button" value="Facebook" class="facebook">
<input type="button" value="Instagram" class="instagram"></a>
<p>Dont Have An Account <a href="#">Sign Up</a></p>
</div>
</center>
</div>
</head>
<style>
.screen{
background-image:url(E:/my%20all%20tools/app%20coding%20items/wallpapers%20and%20logos/pen.jpg);
width:100%;
height:100%;
background-size:cover;
background-position:center;
position: absolute;
}
.logo{
     width: 80px;
     border-radius: 100px;
}
.name{
width: 70%;
padding: 10px 0;
margin: 5px 0;
border: 1px solid black;
outline: none;
background: transparent;
font-size:15px;
}
.box{
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.3), 0 8px 20px 0 rgba(0, 0, 0, 0.19);
position: relative;
overflow: hidden;
width: 350px;
height: 500px;
border-color:red;
background:transparent;
}
.submit{
width:250px;
height:40px;
border-radius:20px;
font-size: medium;
background-color: rgb(65, 219, 240);
}
.facebook{
width:150px;
height:40px;
font-size: medium;
background-color: blue;
border-color:transparent;
}
.instagram{
width:150px;
height:40px;
font-size: medium;
background-color: rgb(250, 70, 100);
border-color:transparent;
}


</style>
</html>
-----------------------------------------------------------------------------------------------------------------------------
Published By:-

Priyanshu Kumar