registration form design in html and css with code html form design examples with code css form design examples with code simple html form templates html form design examples with codepen contact form html css codepen form template html css free download feedback form in html w3schools

A sample form Using HTML + CSS

by 
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Sample Form</title>
    <link rel="stylesheet" href="styles.css">
</head>
<body>
    <div class="form-container">
        <form>
            <h2>Get in Touch</h2>
            <div class="form-group">
                <label for="name">Name:</label>
                <input type="text" id="name" name="name" required>
            </div>
            <div class="form-group">
            <label for="email">Email:</label>
            <input type="email" id="email" name="email" required>
            </div>
            <div class="form-group">
                <label for="Message">Message:</label>
                <textarea name="Message" id="Message"  rows="5" required></textarea>
            </div>
            <div class="form-group">
                <button type="submit">Submit</button>
            </div>
        </form>
    </div>
</body>
</html>
body {
    background-color: #f2f2f2;
    font-family: Arial, Helvetica, sans-serif;
    margin: 0;
    padding: 0;
}

.form-container {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
}

form{
    background-color: white;
    border: 1px solid #dddddd;
    border-radius: 5px;
    padding: 20px;
    width: 400px;
}

h2 {
    text-align: center;
    margin-bottom: 20px;

}

.form-group {
    margin-bottom: 20px;
}

label {
    display: block;
    font-weight: bold;
    margin: 5px;
}

input[type="text"],
input[type="email"],
textarea {
    width: 100%;
    padding: 10px;
    border: 1px solid #cccccc;
    border-radius: 5px;
    cursor: pointer;
    width: 90%;
}

button:hover {
    background-color: green;
}

Youtube Video Tutorial