How to change the Checkbox tick colour

  • Profile Image
    coolk000126
    Asked on April 6, 2024 at 11:19 PM

    Tick colour same as check box in preview form.

    Please advise how to change the tick colour to Black ? it was working fine until recently.

    https://form.jotform.com/240532538724456

  • Profile Image
    Sigit_W
    Replied on April 7, 2024 at 12:38 AM

    Hi Francis,

    Please inject the following CSS code and see if it fits your requirements. This guide will show you how to do that. Let me show you how.

    1. In the Form Builder, select the Paint Roller icon in the upper-right corner.
    2. In the Form Designer panel on the right, go to Styles at the top.
    3. Scroll down to Inject Custom CSS and enter your CSS code in the textarea — all changes are saved automatically.
    /* CSS code to change the checkbox color #13647721 */
    .form-product-item .p_checkbox .checked {
     background-color: black!important; /* change the color to your preference*/
    }
    /* Code ends here. */

    As shown in the screencast below:

    How to change the Checkbox tick colour Image 1 Screenshot 20

    Let us know if there's anything else we can do for you.

  • Profile Image
    coolk000126
    Replied on April 7, 2024 at 12:52 AM

    Thank you.

  • Profile Image
    Sigit_W
    Replied on April 7, 2024 at 12:59 AM

    Hi Francis,

    Thank you for getting back to us. We're glad to have been of help. With that being said, we're marking this ticket as resolved. If you have any further questions or need assistance, please don't hesitate to reach out.