I'm struggling on how to set and use a custom global theme for Salesforce lightning web component. I know how to use the css and set or overite classes, but I don't want to do that on all my components (I'm okay with an import).

My goal is to have a different custom theme that I could set for all my components. So when I use the different variant (e.g. variant="brand") it will get the color of my custom theme. I want to be able to set all custom classes like for Neutral, Brand, Destructive, ...

Here is a reference with classes slds-button_brand:


Here is a reference with variant="brand":


I want to achieve a similar thing as bootstrap themes with override: https://getbootstrap.com/docs/4.1/getting-started/theming/

Code example: When I do that:

    label="My button"

I want this button to be my custom color and not the lwc blue.

Thanks and hope it is clear enough.

1 Answer 1


Ok, I found out that you just need to setup a theme.

To do so:

  1. Go to Salesforce Setup
  2. Open User Interface / Themes and Branding
  3. Activate another theme (or create new one)

By setting up a theme, the slds classes (e.g. slds-button_neutral, slds-button_brand, slds-button_outline-brand, ...) will automaticaly use your new theme color.


You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .