How to remove the hover color?

Can I ask you something else as well please?

How can I change the color of hoverer so that it does not color when the guest is hovering over a section of the form? Since the text is white, the color does not allow the text to show when it is being hovered over.

Can we eliminate it and have just a border? If yes, can I select the color of the border? I am attaching a screenshot as well.

Thank you!! :)

Hi anyroad,

Thanks for patiently waiting. To remove the highlight color, you can follow the steps below:

• In Form Builder, click on the paint-roller icon on the right side of the page.
• Scroll and click on Advance Designer blue button.
• Under Color Scheme, click on the gear icon across simulate highlight.
• Change the color to black or preferred color, then hit save.

You can test my Demo form here.

Give it a try and let us know how it goes.

Thank you so much Kim!

That did the trick! I have one more question (unfortunately!) I will post it here.

When you hover over the different price choices, it is in black and you cannot see anything until you actually click on it. Let me show you what I mean:

Is there any way to have it appear?

Hello anyroad,

Thank you for getting back to Jotform Support. I’m really sorry that this is happening. I found a way to change the color so that they don't need to hover over the text to see them. By injecting the CSS code below:

.form-product-name {

    color : white!important;

}

.undefined span {

}

.fins {

    color : white!important;

}

.currency_abr {

}

.fins {

    color : white!important;

}

#product-name-input_6_1001 {

}

#product-name-input_6_1002 {

}

.form-line.card-1col.jf-required.form-validation-error.form-line-error {

}

#id_6 {

    color : white!important;

}

.form-label.form-label-top {

}

.form-product-item-detail {

}

#cid_6 div.form-product-item-detail {

    color : black!important;

}

.form-product-container {

    color : white!important;

}

#cid_6 label.form-product-container {

    color : white!important;

}.form-label.form-label-top {

}

Let me show you how to do it:

1. Go to Form Designer.
2. Click on Styles,
3. Enter the CSS Code.

Here are the results after adding the code:

Give it a try and let us know if you need any other help.

Thank you Sim! That worked! :)