Shopware 6 How can I use the configured primary colour of the theme in scss?

user_8374833 0
Viewed 388

In the theme settings in the administration I am able to set the primary and secondary colours. How can I use these colours in the theme scss? I already had a look into the documentation but could only find how to add config values as scss but not which already exist and what they are called.

shopware6
1 Answers

There are two ways to figure out what the variables are called:

  1. Look for the default values of the variables in the scss. The default values are defined in vendor/shopware/storefront/Resources/app/storefront/src/scss/skin/shopware/abstract/variables/_theme.scss which lists the variables for the values that can be configured in the administration.
  2. The fields that may be configured are defined in the theme.json. For the default theme this is located in vendor/shopware/storefront/Resources/theme.json. Look for the keys in config.fields.

So for the primary and secondary colours the variable names are $sw-color-brand-primary and $sw-color-brand-secondary.

user_83748330
Related