Theming Embedded Applications
Theming of embedded applications works in exactly the same way as for any other Vaadin component.
By default, embedded Vaadin applications use the Lumo
theme (if it is found in the classpath), or no theme at all.
See Styling and Themes for more information.
Assigning a Theme
You can specify a theme, for example the Material
theme, for your embedded Vaadin application using the @Theme
annotation.
Example: Using the @Theme
annotation to apply the Material
theme to the MyExporter
embedded application.
@Theme(Material.class)
public class MyExporter
extends WebComponentExporter<Div> {
The annotation @Theme(Material.class)
applies the Material
theme to the embedded application and it works the same as in regular Vaadin applications.
It’s enough to specify a theme in only one of the exporters of your application.
If there is no theme declaration then the Lumo
theme is used when available in
the classpath as mentioned above.
Using Multiple Themes
Note
| Compatibility Mode is no longer supported from Vaadin 14.12 onwards |
It is not possible to use more than one theme in a single embedded application. Themes are detected during build time (or startup in compatibility mode’s development mode) and an exception is thrown if different themes are found.
If you need to use multiple themes, create multiple embedded applications (one per theme) and split the functionality accordingly. Each embedded application uses its own theme and the main application embeds several themed applications instead of one.
AB934D01-AF8E-4681-B209-B24196DB7007