# Drawer Icons

You can add [Telerik Font or SVG icons](https://www.telerik.com/blazor-ui/documentation/common-features/icons) to the Drawer items. The component also supports custom icons.

To use Drawer item icons, define a property in the component model class and assign the property name to the `IconField` parameter of the Drawer.

The model property can hold:

* A property of the static `SvgIcon` class;
* A member of the `FontIcon` enum;
* A `string` that is a CSS class for a custom icon.

If the icon property name in the Drawer model is `Icon`, there is no need to set the `IconField` parameter.

To select an SVG icon variant for each Drawer item, set the `IconVariantField` parameter to the model property name that holds the variant name. The default field name is `IconVariant`. See [SVG icon variants](https://www.telerik.com/blazor-ui/documentation/common-features/icons#use-svg-icon-variants) and [Drawer Data Binding](https://www.telerik.com/blazor-ui/documentation/components/drawer/data-bind).

> Make sure to [register `font-icons.css` if using Telerik font icons](https://www.telerik.com/blazor-ui/documentation/common-features/icons#font-icon-stylesheet).

> caption How to use icons in the Telerik Drawer

<demo metaUrl="client/drawer/icons/icons-1/" height="420"></demo>

## See Also

* [Drawer Data Binding](https://www.telerik.com/blazor-ui/documentation/components/drawer/data-bind)
* [Drawer Demos](https://demos.telerik.com/blazor-ui/drawer/overview)