Title: Contact WPForm CSS Fields Overlay
Last modified: December 25, 2018

---

# Contact WPForm CSS Fields Overlay

 *  Resolved [mcoustasse](https://wordpress.org/support/users/mcoustasse/)
 * (@mcoustasse)
 * [7 years, 6 months ago](https://wordpress.org/support/topic/contact-wpform-css-fields-overlay-2/)
 * Hi, I need support with the css to change the automatic theme color for the contact
   form, using wpforms.
    When u select a field, u see a “purple” border thing. I
   would like to remove that effect, or change the color. Please help me, I’ll wait
   for you answer and thank you anyway 🙂
 * This is the example of what I want to change or remove (im working in localhost
   to try a new theme, cant share a website url, only screenshots):
 * > [Contact Form, Purple hestia theme color when selecting a field.](https://imgur.com/a/uWtFGN3)

Viewing 4 replies - 1 through 4 (of 4 total)

 *  Plugin Support [Ethan Choi](https://wordpress.org/support/users/ethanchoi/)
 * (@ethanchoi)
 * [7 years, 6 months ago](https://wordpress.org/support/topic/contact-wpform-css-fields-overlay-2/#post-11030346)
 * Hi mcoustasse,
 * From your screenshot, it looks like the border style is an effect of the site
   theme. To modify the color, of the bottom border, you can use the following custom
   CSS:
 *     ```
       div.wpforms-container-full .wpforms-form input:focus {
           border-bottom: 1px solid #fff000 !important;
       }
       ```
   
 * The snippet above adds a 1px yellow (#fff000) border when a field is selected.
   Please feel free to modify the style values according to your preference.
 * And in case it helps, WPBeginner has a tutorial on [how to add custom CSS like this to your site](http://www.wpbeginner.com/plugins/how-to-easily-add-custom-css-to-your-wordpress-site/).
 * I hope this helps 🙂
 *  Thread Starter [mcoustasse](https://wordpress.org/support/users/mcoustasse/)
 * (@mcoustasse)
 * [7 years, 5 months ago](https://wordpress.org/support/topic/contact-wpform-css-fields-overlay-2/#post-11035550)
 * Hi [@ethanchoi](https://wordpress.org/support/users/ethanchoi/)
    Thank you for
   your answer, the thing is that with that CSS, there is a border in some of the
   fields, but not in the message field for example, only name, email and phone 
   number, the problem is that the “purple theme border thing” is still there and
   it looks wierd, like both border together, isnt there a way to desactivate any
   border effect while selecting a field of the form? So I dont need to start trying
   adding a different kind of contact form. Thank you, Matías Coustasse
 *  Plugin Support [Ethan Choi](https://wordpress.org/support/users/ethanchoi/)
 * (@ethanchoi)
 * [7 years, 5 months ago](https://wordpress.org/support/topic/contact-wpform-css-fields-overlay-2/#post-11045594)
 * Hi mcoustasse,
 * Thanks for the details. Could you share a link to the form on your site, so we
   can take a look?
 * Thanks 🙂
 *  Plugin Support [Ethan Choi](https://wordpress.org/support/users/ethanchoi/)
 * (@ethanchoi)
 * [7 years, 5 months ago](https://wordpress.org/support/topic/contact-wpform-css-fields-overlay-2/#post-11061664)
 * Hi mcoustasse,
 * We haven’t heard back from you in about a week, so I’m going to go ahead an close
   this thread for now. But if you’d like us to assist, please feel welcome to continue
   the conversation (please just see my post above).
 * Thanks! 🙂

Viewing 4 replies - 1 through 4 (of 4 total)

The topic ‘Contact WPForm CSS Fields Overlay’ is closed to new replies.

 * ![](https://ps.w.org/wpforms-lite/assets/icon.svg?rev=3254748)
 * [WPForms - Easy Form Builder for WordPress - Contact Forms, Payment Forms, Surveys, & More](https://wordpress.org/plugins/wpforms-lite/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/wpforms-lite/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/wpforms-lite/)
 * [Active Topics](https://wordpress.org/support/plugin/wpforms-lite/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/wpforms-lite/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/wpforms-lite/reviews/)

## Tags

 * [color](https://wordpress.org/support/topic-tag/color/)
 * [contact](https://wordpress.org/support/topic-tag/contact/)
 * [form](https://wordpress.org/support/topic-tag/form/)

 * 4 replies
 * 2 participants
 * Last reply from: [Ethan Choi](https://wordpress.org/support/users/ethanchoi/)
 * Last activity: [7 years, 5 months ago](https://wordpress.org/support/topic/contact-wpform-css-fields-overlay-2/#post-11061664)
 * Status: resolved