# Appearance

The DateTimePicker provides a predefined set of appearance options.

Apart from the default vision of the DateTimePicker, these alternative styling options enable you to configure each individual aspect of the appearance of a DateTimePicker.

The following example demonstrates all the available appearance options of the DateTimePicker in a single, configurable demo.

[Demo Source](https://demos.telerik.com/kendo-react-ui/dateinputs/datetimepicker/appearance/overview/source.txt)

## Size

You can set the size of the DateTimePicker through the [`size`](https://www.telerik.com/kendo-react-ui/components/dateinputs/api/datetimepickerprops#size) property. The DateTimePicker component comes in three different sizes: `small`, `medium` (default), and `large`.

[Demo Source](https://demos.telerik.com/kendo-react-ui/dateinputs/datetimepicker/appearance/size/func/source.txt)

## Fill Mode

You can set the fill mode of the DateTimePicker through the [`fillMode`](https://www.telerik.com/kendo-react-ui/components/dateinputs/api/datetimepickerprops#fillmode) property. The DateTimePicker provides three different fill mode options: `solid` (default), `outline`, and `flat`.

[Demo Source](https://demos.telerik.com/kendo-react-ui/dateinputs/datetimepicker/appearance/fillMode/func/source.txt)

## Rounded

You can set the roundness of the DateTimePicker through the [`rounded`](https://www.telerik.com/kendo-react-ui/components/dateinputs/api/datetimepickerprops#rounded) property. The DateTimePicker component supports five different degrees of roundness: `small`, `medium` (default), `large`, `full`, and `none`.

[Demo Source](https://demos.telerik.com/kendo-react-ui/dateinputs/datetimepicker/appearance/rounded/func/source.txt)

## Suggested Links

* [API Reference of the datetimepicker](https://www.telerik.com/kendo-react-ui/components/dateinputs/api/datetimepickerprops)
* [datetimepicker `rounded` options](https://www.telerik.com/kendo-react-ui/components/dateinputs/api/datetimepickerprops#rounded)
* [Creating Custom Styles](https://www.telerik.com/kendo-react-ui/components/styling/theme-builder)
* [React Date Inputs](https://www.telerik.com/kendo-react-ui/components/dateinputs)
