Use FontAwesome Icons

The ToolBar enables you to use FontAwesome icons as its sprite icons.

To use FontAwesome icons as ToolBar sprite icons, add <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet"> to the _Layout.cshtml file.

@(Html.Kendo().ToolBar()
                .Name("toolbar")
                .Items(items =>
                {
                    items.Add().Type(CommandType.Button).Text("Paper plane").SpriteCssClass("fa fa-paper-plane");
                    items.Add().Type(CommandType.Button).Text("Plane").SpriteCssClass("fa fa-plane");
                    items.Add().Type(CommandType.Button).Text("Space shuttle").SpriteCssClass("fa fa-space-shuttle");
                }
                )
)

<style>
    .fa.k-sprite,
    .fa.k-sprite::before {
        font-size: 14px;
        line-height: 16px;
    }
</style>
    public class ToolBarController : Controller
    {
        public IActionResult Index()
        {
            return View();
        }
    }

See Also

In this article
Not finding the help you need? Improve this article