+

Contact Form






PixelzUI provides contact-us module for your web templates and themes.

Types

Following are the two types of contact-form module.
  1. Square
  2. Semi-rounded
=>Other types are based on color class(es).

Classes

Following are the classes to use contact Form in your web-page.

  1. .contact
  2. .contact-mdl
.
=>Other classes are based on color class(es).

How to use

  1. Add .contact as class attribute in <div>.
  2. <div class="contact"></div>
  3. Add .contact-mdl as extra in parent <div>.
  4. <div class="contact contact-mdl"></div>
  5. Create a panel as illustrated in panel section.
  6. Rename header as Contact-Us in .pnl-hdr.
  7. <div class="pnl-hdr">
     <b class="ftF">Contact-Us</b>
    </div>
=>* means (srnd, & rnd).

Demo

Square Contact Form

Contact-Us
Got a question? We'd love to hear from you. Send us message and we will respond as soon as possible. We have got everything covered for your needs.
Semi-rounded Contact Form

Contact-Us
Got a question? We'd love to hear from you. Send us message and we will respond as soon as possible. We have got everything covered for your needs.

Module Code

<div class="contact contact-mdl"> <div class="pnl pnl-srnd"> <div class="pnl-hdr bg-db t-wt"> <b class="ftC">Contact-Us</b> </div> <div class="pnl-bdy bg-bl t-wt"> <div class="cntrA ft3 ft-b"> Got a question? We'd love to hear from you. Send us message and we will respond as soon as possible. We have got everything covered for your needs. </div> <div class="cl cl2"> <input class="if if-t if-exp bg-sb t-wt br-wt" type="text" placeholder="Full Name" /> <input class="if if-t if-exp bg-sb t-wt br-wt" type="text" placeholder="Email Address" /> <input class="if if-t if-exp bg-sb t-wt br-wt" type="text" placeholder="Country" /> <input class="if if-t if-exp bg-sb t-wt br-wt" type="text" placeholder="Phone Number" /> <input class="if if-t if-exp bg-sb t-wt br-wt" type="text" placeholder="Subject" /> </div> <div class="cl cl2"> <textarea class="if if-o if-exp bg-sb t-wt br-wt" placeholder="Type message here....." style="height:42vh;"></textarea> </div> </div> <div class="pnl-ftr bg-bl t-wt"> <button class="btn btn-o btn-exp btn-srnd btn-psh bg-nb t-wt br-nb bg-bl-hvr t-nb-hvr">Send <i class="fa fa-paper-plane"></i></button> </div> </div> </div>