# Changing the title color dynamically

> Trigger type: **Simple** Action type: **Merge Component Schema**

Trigger type: **Simple** Action type: **Merge Component Schema**

This advanced logic changes the label color of a text field component when the user selects the desired color from a list. The change applies using a custom CSS file.

**Prerequisites:** Add the CSS classes containing the new color for the text field in the **Custom CSS** property field of the form.

![docs image](https://dev-assets.cms.uipath.com/assets/images/activities/activities-docs-image-215795-77cf6a18.webp)

For example, the CSS snippet below contains a class that sets the label color to green or red:

```
.textFieldLabel-green 
{
   color : green;
}
.textFieldLabel-red 
{
   color : red;
}
```

After referencing the CSS classes in the **Custom CSS** property field, design your form following the steps below:

1. Add one **Text Field** component and one **Radio** component. Pay attention to their **Property Names**, as you use those in your advanced logic.
2. In the **Display** tab of the text field component, set a default **Custom CSS Class**. For example, to set red as the default color of the text field, use the `textFieldLabel-red` class. The class must be defined in the CSS file you created for the **Prerequisites** section.
   
   ![docs image](https://dev-assets.cms.uipath.com/assets/images/activities/activities-docs-image-181332-95026bbd.webp)
3. For the **Radio** component, add two values for the colors `green` and `red`.
4. Go to the **Logic** tab of the **Text Field** component.
5. Add a logic and name it `"color selection"`.
6. Select the **Simple** trigger type.
   1. From the **When the form component** dropdown menu, select `Radio ({radio_field_key})`.
   2. In the **Has the value** field, enter `"green"`.

   The above configuration detects if the user selects `"green"` from the radio options and triggers the action to change the text field label color.
7. Add an action and name it `"change color using css"`
8. Select the **Merge Schema Component** action type and enter the following snippet:
   ```
   return { customClass: "textFieldLabel-green" }
   ```
9. Save the action and the logic.
10. Save the component.

At runtime, if the business user selects the `"green"` radio button, the label of the text field becomes green. If the user selects the `"red"` radio button, the label of the text field becomes red.
