How to dynamically (not via annotation) set Theme Preset ?

Flow
1

How to dynamically (not via annotation) set Theme Preset ?

2

There is no API for this yet. There is ticket about it here

https://github.com/vaadin/flow/issues/5163

On the other hand Lumo them itself can be customized dynamically by setting CSS variables. Which means that there is actually much less need for it.

What works best is depending on the use case, and how extensive modifications it is all about.

If you need to adjust couple of custom properties only, you could do in MainLayout something like:

getElement().getStyle().set("--lumo-...","red");

If you are having more variables to change, you could and something like following in your global shared-styles.html file:

.alternative-theme {
   --lumo-primary-color: red;
   ...
}

You can edit the variables visually using this tool

https://demo.vaadin.com/lumo-editor/

And you can copy the whole set of variables to .alternative-theme block.

After that you can toggle the whole set programmatically on in the main layout using e.g. addClassName(“alternative-theme”)