How to change the default form page color?

  • Profile Image
    trhcux
    Asked on March 15, 2021 at 10:26 AM

    There are multiple posts on the forum attempting to remove the gray background color (#ecedf3) that Jotform applies to the body tag:

    https://hipaa.jotform.com/answers/2797210-how-can-i-remove-change-the-background-image-and-hyperlink-colour-in-thank-you-page

    https://hipaa.jotform.com/answers/2730268-can-i-change-the-background-of-my-thank-you-page-to-match-my-form

    https://hipaa.jotform.com/answers/2629364-how-do-i-remove-the-page-background-on-my-form-from-the-thank-you-page


    ^ Those are just a few examples of this same question being asked over and over and over again. The solutions don't work, because the Custom CSS that gets applied to the form does not get applied to the thank you message.

    Jotform has the following default styles that should be removed:

    body {
     font-family: Inter, sans-serif;
     font-size: 16px;
     background-color: #ecedf3;
     color: #2c3345
    }

    div.stageContainer {
     background-color: #ecedf3
    }

    Those styles come form this CSS file:
    https://cdn.jotfor.ms/themes/CSS/5e6b428acc8c4e222d1beb91.css?themeRevisionID=5f7ed99c2c2c7240ba580251

    On the regular form, the background can be (has to be) removed every time. On the Thank You page, the Form CSS is not applied, so there is no way to remove the gray background from the thank you message.

    Can you please remove the default gray background, as its does not make any sense to have that as a default style. Overriding a browser default of white is bad practice and causes a lot of lost time and resources at Jotform and for all our us - the customer.

  • Profile Image
    trhcux
    Answered on March 15, 2021 at 10:30 AM

    For anyone that searches to forums, and finds this post, here is how you have to/can fix the gray background problem FOR EVERY FORM YOU CREATE:

    1. Click the blue, paint roller icon to access Form Styles:
      1615818517_604f6f1539c76_
    2. In the Form Designer, inside the "Color" tab, change "Page Color" from the default of #ecedf3 (gray) to #ffffff (white), or whatever color you want.

    1615818479_604f6eefacf8e_

    This should remove the unwanted default gray background on the form's thank you message.


    Jotform - please make #fff the default setting.


  • Profile Image
    Gustavo_H
    Answered on March 15, 2021 at 03:51 PM

    Hi, trhcux. Thank you for reaching support!


    Our apologies for this inconvenience. I think the designers have chosen this gray color for the form page because the form itself is already white by default so that they can highlight the form content area.

    If you have worked on your form design, but you do not want to keep applying these changes to whatever form you have, you can clone your form following the guide below and remove the form fields all at once.

    Complete guide 👉 How-to-clone-an-existing-form-from-your-account

    Complete guide 👉 How-to-manage-multiple-fields


    Please, let us know if we can help you with anything else.


    Thank you  😄

  • Profile Image
    trhcux
    Answered on March 15, 2021 at 05:51 PM

    It would be much better for everyone if the Jotform product designers applied the style as follows:

    body.JotFormBuilder #stage {
    background-color: #ecedf3; /* only in edit view */
    }

  • Profile Image
    Laura_L
    Answered on March 16, 2021 at 01:33 AM

    Hi,

    I understand your point of view in wanting to remove the grey background, and I have forwarded this as a feature request to our back-end team. However, we cannot guarantee an ETA or that it will be implemented, but we are constantly trying to develop our features based on our customers' voices.
    As soon as we have any updates regarding this feature, we will inform you on this thread.