To customize forms in the EmbedForms platform, you can use the Custom CSS field in the General Settings of your form.

Open your form, and in the Create section select General Settings on the left.

Scroll down and you'll see the Custom CSS white box where you can insert the codes:

Once you insert the codes, make sure you click on Apply, and at the end click on Save at the right top corner to save the changes.

In this example we are changing the CSS of the text in the Questions of the Form.

For the Font color and background color of the questions' text, The css class is

.es-label

An example of applying a change to the font color and background color:

.es-label {
background-color: #ADD8E6;
color: blue;
}

After you click Apply and Save, go to Preview to see the changes:

If you need to change the font size and alignment of the questions' text, add the following inside the brackets {} for example right after the ; of the color:

font-size: 16px;
text-align: left;

For changing the Submit button text color, background color of text, font size and alignment, please use .es-submit-btn

An example:

.es-submit-btn

{
background-color: #000;
color: yellow;
font-size: 16px;
text-align: left;
}

Important note:

The changes made with CSS are currently visible in the Preview of the form. The Preview button is placed on the top right corner, next to the Save button.

If you need any further help with Custom CSS feel free to chat with us via Intercom or send us an email to: support@embedsocial.com