This is contact us form demo and it's create usign pure css. in this contact us form we add three inputs full name,email and message. this contact us page design is fully responsive. you can also customize this contact us form and also add other fields for your requirement.

you can get code of contact us page html snippet. we give you example of contact us page html design , you can simple copy bellow code and use in your project. If it free snippets of contact us page design examples in html So you have to simple get those bellow code from tab of html, css and js. you simple click on HTML Code then you will get html code contact us page template free download snippets, click on JS Code tab get code of jquery codd for contact page template snippets, same as for CSS Code tab. It's pretty easy and simple example of Singal page contact us page design snippet.


<!DOCTYPE html> <html lang="en"> <head> <title>Contact us Form</title> <link rel="stylesheet" type="text/css" href="custom.css"> <link href="https://fonts.googleapis.com/css?family=Barlow+Semi+Condensed" rel="stylesheet"> </head> <body> <div class="form "> <div class="hedding-title"> <h1>Contact Us</h1> </div> <div class="hedding-description"> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod quis nostrud exercitation ullamco laboris nisi ut aliquip laborum.</p> </div> <div class="form-input"> <form> Full Name:<br> <input type="text" placeholder="Full name..."><br> Email:<br> <input type="text" placeholder="Email..."></br> Message:<br> <textarea rows="4" placeholder="Message.."></textarea> <button class="button">Send Message</button> </form> </div> </div> </body> </html>
body{ background-color:#c1c1c1; font-family: 'Barlow Semi Condensed', sans-serif; } .form{ padding:30px; width:50%; margin:0 auto; color:#fff; margin-top:30px; border:1px solid #FF9656; border-radius: 5px; background-color: #333; } .hedding-title{ font-size:25px; text-align: center; } .hedding-title h1{ margin:0px; color:#ff9656; font-weight: normal; } .hedding-description{ text-align: center; } .form-input input, .form-input textarea{ width:100%; margin: 15px 0px; font-size:18px; font-family:"Barlow Semi Condensed",sans-serif; border-radius: 0px; border: 1px solid #c1c1c1; } .button{ padding:8px 0px; width: 100%; margin-top:15px; background-color:#FF9656; border: none; color: #fff; } @media (min-width:320px) and (max-width:640px){ .form{ width:80%; } } @media (min-width:768px) and (max-width:1024px){ .form{ width:60%; } }




Random Post




Related Post

Responsive bootstrap code of login design page

Responsive bootstrap code of login design page

sample code of bootstrap login page. bootsstrap login page with social login button. and you can easaly implement in your project. you can get code of how to...

Read More
Login form with social login design using bootstrap

Login form with social login design using bootstrap

Simple login page form design using html and css. we provide free code for login page. this page design using by bootstrap. you can get code of bootstrap log...

Read More
Register and login form page design with animation using bootstrap

Register and login form page design with animation using boo...

you can get free ragister and login form page design free. register and login form design in tab with every refresh different background animation. you can g...

Read More