Icon DropDownButton

You can enhance the textual content of the DropDownButton by adding image, predefined, or custom icons to it.

With a view to the web standards, it is better to use a background image because icons are used for decoration and not for representing structural content.

The DropDownButton provides options for:

• Using the built-in KendoReact SVG icons. They are applied through the svgIcon property and displayed as a background for the DropDownButton. To see the full list of the web svg icons in KendoReact, refer to the article on our Design System Kit.
• Adding FontAwesome and other font icons. They are implemented by setting the required third-party CSS classes through the iconClass property.
• Adding image icons. They are applied through the imageUrl property of the component.

The following example demonstrates how to use the different types of icons in a DropDownButton.

html

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css" />

Change Theme

Theme

Loading ...

Suggested Links

• API Reference of the DropDownButton