Applying a Custom Application Theme

An application theme is used from a Maven repository, such as Maven Central or a local repository. Once you have created a custom theme and packaged it as a JAR file, you can install it to a repository.

Once the theme is installed in the repository, you can use it by adding a dependency for it to the pom.xml in the project’s root folder:

<dependencies>
  ...
  <dependency>
    <groupId>com.example</groupId>
    <artifactId>exampletheme</artifactId>
    <version>1.0</version>
  </dependency>
</dependencies>

Next, the theme needs to be applied to the component samples. Change the @Theme annotation in src/main/java/com/vaadin/demo/DemoExporter.java as shown in the following:

@Theme("exampletheme")
public abstract class DemoExporter<T extends Component> extends WebComponentExporter<T> {
  ...
}

The website needs to be rebuilt, or restarted in development mode, in order for the change to take effect.

Note	Application theme vs website styling This article is about the theme used for rendered UI samples, which is distinct from the documentation website’s styles covered in the Site Customization documentation.

28290DCF-3F92-4ECE-B72D-32641359C096

Documentation

Documentation

Applying a Custom Application Theme