# Styling

Blazor Edition provides a set of native UI controls built for Blazor such as FlexGrid, Chart, ListView, and input controls including AutoComplete and ComboBox.

## Content



Expander provides various options to style its UI and elements. It allows you to use different styling properties available in the **C1Expander** class which allows you to easily style various visual aspects of the control. The following table lists all the styling properties available in the **C1Expander** class:

| **Properties** | **Description** |
| --- | --- |
| Style | Changes the style of Expander |
| HeaderStyle | Changes the style of the expander header |

![Blazor Expander control with styles set on header and expand icon](https://cdn.mescius.io/document-site-files/images/f5b600ba-f1a7-4f89-a20c-aa6c0c35880d/images/expanderstyling.png)

The following code demonstrates the use of the available styling properties in the C1Expander class to change the appearance of the Expander control:

```razor
<C1Expander Header="@("Click")" HeaderStyle="@("background-color: BurlyWood; color:#fff1e6; font-family:cursive;font-size:22px")" 
            Style="@("overflow:hidden;background-color:Beige;width:8%;box-shadow:0px 5px 5px rgba(0,0,0,0.2)")">
            <img src="/Image/c1icon.png" />
</C1Expander>
```