How do I change the color and font-weight of options in checkboxes?

  • Profile Image
    HAApplications
    Asked on November 06, 2015 at 12:48 AM
  • Profile Image
    Mike_G
    Answered on November 06, 2015 at 02:10 AM

    Could you share us the form and the field on that form you would want the font color be changed? 

    You can change that through Designer tool, 

    Then, 

    Result:

    Another option is by injecting custom CSS codes to your form, which will be very helpful if you're just trying to change the font color of a specific text box field on the form.

    Here's a guide on how you can inject custom CSS to your form: How-to-Inject-Custom-CSS-Codes

  • Profile Image
    HAApplications
    Answered on November 06, 2015 at 08:45 PM
    This does not work for the label text within checkbox fields.

    I am looking to increase the font size an change the color on the text in check box fields.



    Adam J. Maywhort
    Homefront America, Inc.
    A 501(c)(3) all-volunteer nonprofit
    EIN: 54-2178448
    www.homefrontamerica.org

    FB-Signup-Button-JPEG

    HA E-Mail Sig Logo FBLogo

    ...
  • Profile Image
    Steve 
    Answered on November 06, 2015 at 09:05 PM

    But your question asked specifically for text boxes, not check boxes:

     

    Here's a user guide on the terms of the commonly used form fields to avoid confusion and for the support team to reply with the appropriate answer.

    Textbox: Usually used for getting text based entries.

     

     

    Check Box: Used for multiple choices.

  • Profile Image
    HAApplications
    Answered on November 06, 2015 at 09:45 PM
    What I am trying to change is the text within the check box options. The current text it too small and too light. I want to make it black text and bold.

    Adam J. Maywhort
    Homefront America, Inc.
    A 501(c)(3) all-volunteer nonprofit
    EIN: 54-2178448
    www.homefrontamerica.org

    FB-Signup-Button-JPEG

    HA E-Mail Sig Logo FBLogo

    ...
  • Profile Image
    Mike_G
    Answered on November 07, 2015 at 03:23 AM

    @HAApplications

    To achieve such, you can inject some CSS codes to your form using this guide: How-to-Inject-Custom-CSS-Codes

    Note: If there are codes in the Inject Custom CSS section of your form properties, do not delete those codes, just add the codes below after the codes present in your form.

    Here's the code: 

    .form-checkbox-item label{

    color: black !important;

    font-weight: bold !important;

    }

     

    Don't forget to save the form after the changes. 

    You can check the sample form I've used for testing. 

    https://form.jotform.com/53101481251947

    I hope this helps. Let us know if the codes above didn't change the text on your checkbox options. Please give us the link to the form where you would like to have the changes applied so we may check. Thank you.