Custom Icons With Vaadin 14
To use custom icons with Vaadin 14+, please see How to use Material icons in Vaadin Flow (14.6). To embed SVGs as icons into your app, see Images and Icons.
- The SVG way is the easiest, just drop the svg file into
src/main/webapp/my.svg
then passnew Icon("my.svg")
as an icon to any Vaadin component (e.g. button). The disadvantage of SVGs is that you can’t change their color easily - To embed icon font see Custom Themes: Other Theme Assets
then create a
new Span()
which looks like<span style='font-family: My Font'>&#e854;</span>
to insert anadd_shopping_cart
icon from Google Icons. - Do this VaadinIcons style, using iconset: see FontAwesomeIconSet sources for more details.
Written on April 19, 2022