# Styling and Appearance

Style and customize the appearance of the TimeEditor control. Learn more about customizing the appearance of the TimeEditor control in Blazor documentation.

## Content



TimeEditor provides various options to customize the appearance of the TimeEditor control and all its elements individually, so that you can style and display the TimeEditor control as per your requirement. The C1TimeEditor class provides several properties such as **DropDownBehavior**, **CollapsedButtonIcon** and **ExpandedButtonIcon** which offers different ways of customizing the appearance of the TimeEditor control.

![Styled TimeEditor control](https://cdn.mescius.io/document-site-files/images/f5b600ba-f1a7-4f89-a20c-aa6c0c35880d/images/timeeditor-icon.png)

The following code demonstrates the use of the available appearance customization properties to change the appearance of the TimeEditor control.

```csharp
<C1TimeEditor Value="DateTime.Today" DropDownBehavior="DropDownBehavior.HeaderTap" ClockType="@ClockType.Type24">
    <CollapsedButtonIcon>
        <span class="oi oi-timer"></span>
    </CollapsedButtonIcon>
    <ExpandedButtonIcon>
        <span class="oi oi-timer"></span>
    </ExpandedButtonIcon>
</C1TimeEditor>
```