Style headings in Forms

[user24177]

Hi, can anyone provide me with a CSS template to edit the heading style in forms? Thanks!

[Max]

Hi there, @user24177

Do you mean the title of the form pages? What exactly would you like to change in the title style (font, font-weight, size, color)?

[user24177]

Hi there,

All titles - the main form and the title fields you can add. If they have different identifiers that’s good, as I can style them differently.

I can fill in the correct styling I need, I just don’t know how to identify them in CSS. So if you could just change the size as an example I can fill in the rest.

Thanks so much!

[Max]

Hi @user24177

Here is the code to change the color, size and font family of the page titles:

[class*="FormLayout__PageTitle-sc"] {
  font-size: 30px;
  color:red;
  font-family: Calibri;
}

You can change the size, color and font weight of the headings, labels and field text in the Form Fields section on the Appearance tab

Check it out and let me know if it helped

[user24177]

Thank you! Can you make it so it targets heading fields?

[Max]

Sure, here is the class of the heading field element - Heading__HeadingControl-sc

For example, here is the code to change the font family of the headings:

[class*="Heading__HeadingControl-sc"] {
  font-family: Times New Roman;
}

[user24177]

Amazing, thank you!

[Max]

It’s my pleasure