Button

Usage Guidelines

The Telerik and Kendo UI Button requires you to follow some basic principles when using the component.

Fill Modes

The Button supports the solid, outline, and flat fill modes, which put different emphasis on the indicated actions.

DoUse different fill modes to differentiate the importance of actions.

Don'tAvoid using buttons with the same fill mode when they indicate a decision users must make or an action users must perform.

Label Text

The label of the Button must be clear, straightforward, and leaving no room for misinterpretations.

DoUse active verbs or phrases that clearly indicate the Button action.

Don'tAvoid using vague and generic labels which make the user read the dialog before taking action.

Label Width

Whether the Button renders an icon, icon and text, or text only, it must convey a clear message, be compact, concise, and tight-fitting.

DoKeep the length of the Button label as short as possible.

Don'tAvoid using too much text for the Button label.

Size

Depending on the purpose of the Telerik and Kendo UI Button, you can apply any of its supported sizing options to smoothly fit it into the UI. However, sizing needs extra attention when you combine two or more sizing variations in a single component.

DoUse Buttons of different sizes in the context of the UI.

Don'tAvoid combining Buttons of different sizes inside a single component.