# Working with Conditional Styles

Conditional styling allows to show/hide, disable, make required or clear form components conditionally. Conditional styling can be applied to various form components:

* Data Source object fields
* Virtual fields&#x20;
* Section/Page
* Custom Button
* Blank Space
* Custom URL
* Nested Form
* Static Text
* File
* Image
* Related Lists and Lists

{% hint style="warning" %}
Note! When conditional styles applied to the Section/Page component - it will be applied to all items inside the section.
{% endhint %}

### Configure Conditional Styles:

Click on Section to open it's Settings.

Click "**Add New**" button under Conditional Styles.

<img src="/files/q9IyOfhvgg4U5yiEnvbG" alt="" class="gitbook-drawing">

On "**Conditional Style Settings**" popup choose action type and  add [Conditions](/components/forms/basics/working-with-conditions.md):

<img src="/files/sKdjqieLhUhfsz9cHsPL" alt="" class="gitbook-drawing">

{% hint style="info" %}

* hide - item will not be displayed
* show - item will be displayed
* disable - item will be displayed in read only mode
* clear - item inputs will be cleared
* required - item will be required to be filled in (available for input items only)
  {% endhint %}

Below settings will display Section in case form "inputmultiselect" field is equal to "Option 1":

<img src="/files/Eo8w0Rmyx3LQguL35Ayq" alt="" class="gitbook-drawing">

Conditions can be combined using logic expressions:

<img src="/files/eZyL1lSajGD91Jqjfkcm" alt="" class="gitbook-drawing">

{% hint style="info" %}
You can enter as many conditions as required. By default all conditions will be joined with AND connector.&#x20;

You can set custom join rules in such format: ({1} AND {2}) OR ({3} AND {4}).
{% endhint %}

### Turn on/turn off conditional styles on a form item

For cases when you need to disable conditional styling without removing styles you have added you can simply turn them off:

<img src="/files/kZi7jx8wtvqVxbzsaUez" alt="" class="gitbook-drawing">

You can also turn on/off your styles from Conditional Style Settings popup:

<img src="/files/w6bqkpNfi51DVpHASQ7T" alt="" class="gitbook-drawing">


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.flexikanban.ai/components/forms/basics/working-with-conditional-styles.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
