Default Icons

There are two default icon sets: Vaadin and Lumo.

LIVE DEMO

Declarative Usage

Set an icon for a component with the icon attribute. Use the vaadin: and lumo: prefixes for different icon sets.

<icon icon="vaadin:user"/>
<icon icon="lumo:user"/>

When set through the inspector, the Choose Icon dialog appears, displaying icon names and preview for easier selection:

choose icon dialog

Programmatic Usage

An icon can be set programmatically to a component:

iconButton1.setIcon(VaadinIcon.USER.create());
iconButton2.setIcon(LumoIcon.USER.create());