Free html/css theme and template

If you’re looking for free HTML form themes or templates, there are several resources where you can find them. Here are some popular options.

  1. Bootstrap Themes: Bootstrap is a widely used framework for building responsive websites. Many Bootstrap themes include nicely styled forms. You can find free Bootstrap themes with forms on websites like

form in use theme 1.

form design

html code

<!doctype html>
<html>
<head>

<title>Untitled Document</title>
<style>
		.main{height: 25px; width: 250px; margin-top: 18px; float: left; margin-left: 30px;}
		.a{height: 518px; color:#10821A;  font-family:Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";border-radius: 20px; box-shadow: 0px 0px 20px 1px #888888; width: 600px; margin-top: 100px; margin-left:300px; background: #FFFFFF; border: thin solid;}
		.b{height: 30px; border-radius: 20px; width: 300px;  box-shadow: 0px 0px 20px 1px #888888; margin-left:300px; border: none; background: #10821A; color: #FFFFFF; }
	</style>
</head>

<body bgcolor="#E7E7E7">
	<div class="a" align="center">
		<form action="procase.php" enctype="multipart/form-data">
			<h1 align="center" >Registration form</h1><hr/>
			<input type="text" name="sn" class="main"/><br>
			<input type="text" name="fristname" class="main" placeholder="fristname"/><br>
			<input type="text" name="lastname" class="main" placeholder="lastname" /></br>
			<input type="email" name="email" class="main" placeholder="email or number"/><br>
			<input type="number" name="number" class="main" placeholder="phone number" /></br>
			<input type="password" name="password" class="main" placeholder="password" /></br>
			<input type="date" name="birthday" class="main" placeholder="Date of Birth"/><br>
			<input type="text" name="age" class="main" placeholder="age" /></br>
			<input type="text" name="gender" class="main" placeholder="gender"/><br>
			<input type="text" name="education" class="main" placeholder="education" /></br>
			<input type="text" name="address" class="main" placeholder="address" /></br>
			<input type="text" name="state" class="main" placeholder="state"/><br>
			<input type="text" name="fathername" class="main" placeholder="father name" /></br>
			<input type="text" name="mothername" class="main" placeholder="mother name "/><br>
			<input type="text" name="pin" class="main" placeholder="pin codeRegistration" /></br>
			<input type="submit" class="b" value="Registration" /><br>
		</form>
	
	</div>
</body>
</html>

form in use theme 2.

form design

html code

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<style>
		.main{height: 35px; width: 250px; border-radius: 5px; border: none; margin-top: 30px;}
		.a{height: 420px; box-shadow: 1px 5px 20px 1px #888888; color:#0F2888;  border-radius: 20px; width: 400px; margin-top: 100px; margin-left:500px; }
		.b{height: 40px; border-radius: 5px; width: 250px; border: none; background: #0F2888; color: #FFFFFF; margin-top: 30px; box-shadow: 1px 2px 10px 1px #888888; }
	</style>
</head>

<body bgcolor="#64D4A9">
	<div class="a" align="center">
		<form action="login_procase.php" enctype="multipart/form-data">
			<br/>
			<h1 style="font-family: Segoe, 'Segoe UI', 'DejaVu Sans', 'Trebuchet MS', Verdana, 'sans-serif';" align="center">LOG IN FORM</h1>
			<hr>
				<input type="email" name="email" class="main" placeholder="email or number"/><br>
			<input type="password" name="password" class="main" /><be></br>
			<input type="submit" class="b" value="log in" /><br>
		</form>
	
	</div>
</body>
</html>

HTML FORM DESING USE FOR TEMPLATE

Certainly! Here’s a basic HTML form template you can use as a starting point

HTML Structure:

Uses <form> to encapsulate the form elements and <input>, <textarea>, and <button> for user input.

<!doctype html>
<html>
<head>

<title>html form</title>
	
</head>

<body bgcolor="#D0D0D0"> 
	<div class="box" align="center">
		<h1>FORM USE FOR THEMPLATE</h1>
		<hr/>
		
	<form action="https://disastergo.com" enctype="multipart/form-data">
		<input type="text" name="Username" class="box-in-box" placeholder=" Username" />
		<input type="text" name="Username" class="box-in-box" placeholder=" email or number" />
		<input type="text" name="Username" class="box-in-box" placeholder=" password" />
		<input type="text" name="Username" class="box-in-box" placeholder="address" />
		<input type="text" name="Username" class="box-in-box" placeholder="phone number" />
		<textarea class="box-in-box"></textarea>
		
		<input type="submit" value="SAVE" class="bottun" />
		
			</form>
		<img src="../login-registration/image/splendor-plus-black-PNG-removebg-preview.png" width="350px" height="350px" class="a"></img>
		</div>
	
	<style>
		.box{height: 500px; width:700px; box-shadow: 1px 5px 20px 1px #888888; border-radius: 5px; margin-left: 300px; margin-top: 100px;}
		.box-in-box{height: 30px; width: 250px; margin-top:20px; border:none; box-shadow: 1px 1px 8px 1px #888888; border-radius: 5px; margin-left:400px;}
		.bottun{height: 30px; width: 200px; margin-top:20px;box-shadow: 1px 1px 8px 1px #888888; border:none; border-radius: 5px; margin-left:400px; background: #0017A2; color: #FFFFFF;}
		.a{margin-left:-300px; margin-top:-450px; background: #7FE4E2; box-shadow: 1px 5px 20px 1px #888888; border-radius: 5px;}
	</style>
</body>
</html>

Leave a Comment