Lumo Source code

Style

Lumo defines a set of CSS custom properties you can use to apply consistent visual styles across your application.

Import style.html to use them.

Border radius

You can adjust the top level border radius, which affects many element themes directly.

Removing border radius

If you want to set the border radius to zero, you need to specify a unit for it as well (i.e. 0px or 0em), as it can be used in calc functions which will be undefined if --lumo-border-radius is a unitless value.

Box Shadow


Custom properties

Border radius
--lumo-border-radius
Shadow
--lumo-box-shadow-s
--lumo-box-shadow-m
--lumo-box-shadow-l
--lumo-box-shadow-xl