Changing Field Background Color Using CSS

In this guide, we will explain how to change the field background color based on the field Id via CSS.

Drag and drop a Text, a Date, a Number and an HTML field.

Click the pencil icon of the HTML field and paste the code. Then save the changes.

Use the below code:

<style>

#component-4aeb-c33c-6161 {
  background-color: red;
  border-radius: 10px;
}

#component-c6d6-87c8-42d6 {
  background-color: yellow;
  border-radius: 10px;
}

#component-dc91-89ae-9fba {
  background-color: gray;
  border-radius: 10px;
}

</style>

Note: Please change the field Id as per your form.

Try the form.

For any questions, please contact us - [email protected] or the Formyoula in-app chat 🙂