[SalesForce] Change background color of lighting-Card component

Probably super easy, but struggling to change the background color of a Lighting-Card. Any Suggestions? I can get it to change in the console by manipulating element.style

HTML

<template>
    <div class="myColor">
        <lightning-card title="Opportunity Relisting" icon-name="standard:channel_program_history">
            <template if:true={opp.data}>

                <div class="slds-m-around_medium">
                    <h1>RELISTED OPPORTUNITY</h1>
                    <p>{name}</p>
                    <p>{relistStatus}</p>
                    <p>{relistDate}</p>
                </div>

            </template>
        </lightning-card>
    </div>
</template>

CSS

.myColor.THIS  {
    background: red;

}

Images

What I'm trying to get is this…
enter image description here

This one is the current behavior I have…
enter image description here

Best Answer

you can try this, it will work ! :

:host {
    --sds-c-card-color-background: #a1d6e4;
}
Related Topic