> ## Documentation Index
> Fetch the complete documentation index at: https://help.experro.com/llms.txt
> Use this file to discover all available pages before exploring further.

# What is trait

When you drag and drop a widget that renders an associated component, you'll see different options on the side panel. These options include checkboxes for 'show/hide' headings, dropdowns for 'heading size' options, a 'color-picker' for heading color, and some default options provided by the Experro Storefront. These options are known as traits within the Experro Storefront.
Here in below image you can see options for the `hero-carousel` component.

<img src="https://mintcdn.com/experro/-c3d2Mmp8bZuVNox/images/image-43.png?fit=max&auto=format&n=-c3d2Mmp8bZuVNox&q=85&s=e217349278fa0c6a4df77d11b72d89fa" alt="image.png" width="1413" height="814" data-path="images/image-43.png" />

Here you can see the some Trait's for the `hero-carousel`,
like,

| Trait                   | Description                                                                                                                                                                                                                                                                                           |
| ----------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| CONTENT\_MODEL\_POP\_UP | This trait takes a content model internal name as a configuration value and displays a list of records associated with that content model. It provides the selected Content Model records data as props to a component within the cms-library, effectively integrating the component with the widget. |
| TEXT                    | It's a simple text input where any value entered will be passed as a prop to a component.                                                                                                                                                                                                             |
| CHECKBOX                | It provides the value 'on' if the checkbox is selected and 'off' if the checkbox is unchecked.                                                                                                                                                                                                        |
| DROPDOWN                | It displays multiple values to select from, accepting an options array of JSON where each object has the structure  name: 'Name to Show', value: 'Value which you will get in component' .                                                                                                            |
| COLOR\_PICKER           | A simple color picker provides the selected color's hex value in the component's props.                                                                                                                                                                                                               |

Here, we comprehend the concept of traits; let's delve into [How we can effectively utilize them](./how-to-use-traits).
