Set Color And Appearance

Set Color And Appearance action available in the Rule Panel, used to dynamically change the visual styling of UI elements on the page. It allows you to modify properties like background color, font color, or border color of elements such as buttons, labels, or input fields — based on specific conditions. The element to be styled is specified through the Element ID, which tells the system exactly where the visual change should be applied.

Properties And Explanation

Here are the steps to follow in order to use the Set Color And Appearance action:

1

Select Element Id:

Defines the specific UI element (by its ID) where the visual change will be applied. It ensures the action targets only the intended component.

Note: The remaining properties are already explained under the Color and Appearance tab page. Please refer to that for full details.

Full Configuration Example

Below is a screenshot of the Set Color And Appearance action configuration, showing all properties set for the Select Element Id and All other properties (such as Background Color, Text Color, Border Color, Font Size, etc.)

This screenshot shows the complete configuration of the Set Color And Appearance action, including all relevant properties set up on the page.

A text input named "Age" and a submit button are used. If the condition is met, the "Set Color and Appearance" action changes the background and foreground colors of a specific block container using its Element ID.

Last updated