New to Telerik UI for ASP.NET Core? Download free 30-day trial


The Breadcrumb allows to configure the icons of the items and the delimiters.

Root Icon

The root icon is the first icon and is rendered as a home icon. It can be changed through the items.icon configuration. It is also clickable and it will reset the value of the component.

Item Icon

The icons rendered for each element after the root icon. It is also clickable and can be configured through the items.icon.

Delimiter Icon

The icons that separate the items of the Breadcrumb.


The following example demonstrates how to configure different icons.

        .Items(items =>
                .Text("All Components")
    <kendo-breadcrumb name="breadcrumb"
            <kendo-breadcrumb-item type="BreadcrumbItemType.RootItem" text="All Components" href="" show-text="true" icon="globe" show-icon="true"></kendo-breadcrumb-items>
            <kendo-breadcrumb-item type="BreadcrumbItemType.Item" text="Breadcrumb" href="/breadcrumb" icon="gear" show-icon="true"></kendo-breadcrumb-item>
            <kendo-breadcrumb-item type="BreadcrumbItemType.Item" text="Tag Helper" href="/tag-helper" icon="cloud" show-icon="true"></kendo-breadcrumb-item>

See Also

In this article