Breadcrumb Icons

Updated on Oct 13, 2026

You can add Telerik Font or SVG icons to the Breadcrumb items. The component also supports custom icons.

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

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 Breadcrumb model is Icon, there is no need to set the IconField parameter.

To select an SVG icon variant for each item, set IconVariantField to the model property name that holds the variant name. The default field name is IconVariant. See SVG icon variants and Breadcrumb item features.

Make sure to register font-icons.css if using Telerik font icons.

How to use icons in Telerik Breadcrumb

Example

View Source

Loading ...

Example

View Source

Loading ...

See Also

• Live Demo: Breadcrumb Items