> For the complete documentation index, see [llms.txt](https://themedocs.zenit.design/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://themedocs.zenit.design/en/tips/theme-configuration.md).

# Theme configuration

## Variablen

In the theme configuration, variables may occasionally appear in the color fields, simplifying a consistent look for the color scheme. 

You can find the name of each variable in each theme settings help tooltip.

![Variablennamen in der Theme-Konfiguration](/files/PZwkoNIhmB9LPAyT2Xpp)

## Functions

Even simple SCSS functions may be used in the color fields of the theme configurations. For example, colors can be lightened or darkened.

```
darken($sw-color-brand-secondary, 10%)
```

Darkens the color of the variable by 10%

```
lighten(desaturate($sw-color-brand-primary, 10%), 15%)
```

Multiple functions can also be applied to a variable or color. In this example, the primary color of the store is lightened by 10% and reduced in saturation by 15%. More informations:

<https://sass-lang.com/documentation/modules/color>

## Color Management

To prevent the background from coloring on mouseover, simply set the `Background:hover` on the same color as `background`. This is especially the case for the navigations.