What is JotForm?
JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.

At JotForm, we want to make sure that you’re getting the online form builder help that you need. Our friendly customer support team is available 24/7.

We believe that if one user has a question, there could be more users who may have the same question. This is why many of our support forum threads are public and available to be searched and viewed. If you’d like help immediately, feel free to search for a similar question, or submit your question or concern.


  • Profile Image

    When I choose any option in any form I can see the form changes the color (yellow)...How Can I to change that color? thanks

    Asked by chocolalo on January 03, 2012 at 06:39 PM
    Screenshot
  • Profile Image
    JotForm Support

    Answered by abajan on January 03, 2012 at 09:22 PM

    To remove the highlighting altogether, go into the form's preferences: Setup & Embed > Preferences > Field Styles > Highlight Effect > Disabled.

    To change the color from the current light yellow to something else, inject the following CSS, substituting the color of your choice:

    .form-line-active {
    background: #F60;
    }

    However, some background colors may not contrast enough with the default color (black) of the fields' labels, rendering them difficult to see. In such instances, an extra declaration in the rule will prove useful:

    .form-line-active {
    background: #F60;
    color: #FFF;
    }

    But then there's still the matter of the sub-labels to consider (like those under the input elements of "Full Name" fields, for example). This requires the addition of a separate rule:

    .form-line-active {
    background: #F60;
    color: #FFF;
    }
    .form-line-active
    .form-sub-label {
    color: #FFF;
    }

    Here's a form with the same CSS.

    Incidentally, shorthand color codes are used above. So, #F60 and #FFF are equivalent to #FF6600 (orange) and #FFFFFF (white) respectively.

    EDIT: Since in this example the color used for labels and sub-labels is the same, the rules can actually be combined as follows:

    .form-line-active,
    .form-line-active
    .form-sub-label {
    background: #F60;
    color: #FFF;