New to Kendo UI for Vue? Start a free 30-day trial

Icon ButtonGroup

You can enhance the meaning of the context by adding an icon to the buttons within the ButtonGroup.

The ButtonGroup allows the use of:

Predefined Icons

You can use a set of ready-to-use Kendo UI font icons. For the full list of predefined font icons, refer to this article.

To set a Button icon, either:

  • Add an img element inside the <li> element of the Button, or
  • Set a data-icon attribute to the <li> element of the Button.

The following example demonstrates how to implement font icons by using the data-icon attribute.

Example
View Source
Edit In Stackblitz  
Change Theme:

Icon-Only Buttons

To implement icon-only buttons within a ButtonGroup, do not set any text to the component.

Example
View Source
Edit In Stackblitz  
Change Theme:

In this article

Not finding the help you need?