Highlight Color

  • Profile Image
    Asked on August 30, 2011 at 01:11 PM

    Is there a way to change the highlight color when a cell is selected in my form?  When someone is typing on my Jotform the beige (indicating a field is selected) and the red (indicating a forgotten entry) do not look good with the rest of my site color scheme.

  • Profile Image
    Answered on August 30, 2011 at 02:00 PM

    Hi ohmikey

    Thanks for asking. Inject the following CSS into the form in question.

    .form-line-active {
    .form-line-error {
    background:none repeat scroll 0 0;

    These rules will remove both the highlight color when the focus is on a field (in other words, when the field is selected) and the big pink background on warnings. However, instead of removing them, you can change the colors of both elements to blend with your site. For instance, in the first rule, green can be substituted for transparent. Similarly, in the second rule, coral can be substituted for none. (You can find all 147 color names here.)

    It is also possible to change the color of the text bubble in which the warning is shown.

    A good site to learn the basics of CSS is MaxDesign. Also, Firebug is highly recommended for discovering what classes and IDs should be used to effect desired changes to the appearance of your forms.

    Should you require clarification on anything above or want to know about another aspect of our product, please feel free to post your query on the forum.


    ~ Wayne