> Markdown version of [Legacy theme in MPR](https://vaadin.com/docs/v10/mpr/configuration/legacy-theme). Section index: [llms.txt](https://vaadin.com/docs/v10/mpr/llms.txt)

# Legacy theme in MPR

By default the theme used with MPR is 'valo' and this can be changed with adding the `MprTheme` annotation with the wanted theme name to your root navigation level, RouterLayout or to the top level @Route.

The closest instance found will be used for first initialization for a `UI` instance, but the recommendation would be to put it always on the top most `RouterLayout` in the view chain.

> **Note:** Runtime changing of the theme is not supported

Sample theme definition

```java
@MprTheme("reindeer")
public class MainLayout extends Div implements RouterLayout {
}

@Route(value = "", layout = MainLayout.class)
public class RootTarget extends Div {
    public RootTarget() {
      LegacyWrapper addressbookWrapper = new LegacyWrapper(
                  new AddressbookLayout());
      add(addressbookWrapper);
    }
}
```

The theme can be a old legacy `styles.css` theme or a `styles.scss` theme. In the case of a SASS theme, on-the-fly compilation of works out of the box without any changes.

## <a id="using-your-custom-theme"></a>Using your custom theme

Using your own Vaadin legacy theme remains the same as it was. Create your theme by following the instructions in the themes documentation for [Vaadin 7](https://vaadin.com/docs/v7/framework/themes/themes-overview.html) or [Vaadin 8](https://vaadin.com/docs/v8/framework/themes/themes-overview.html).

Then just add the `@MprTheme` annotation with your theme name on the root level navigation target and your theme will be used for the legacy framework part.