I am trying to override standard salesforce datepicker colors. I want to update a hover color and today color to others. Any ideas how can I do it? I want to do it in my own lwc. I tried to use hooks & static resources to archieve it but nothing worked in my case. I was able to remove today section with the following piece of code. I expect smth like this can help me to override standard date picker box-shadow

.slds-dropdown-trigger_click.slds-is-open button {
    display: none;

enter image description here

1 Answer 1


I was able to solve that issue by myself.

 /* update color & background for today date */
.slds-datepicker tbody>tr>td.slds-is-today>.slds-day {
    background: green;
    color: blue;

/* update color & background for selected date */
.slds-datepicker tbody>tr>td.slds-is-selected>.slds-day {
    background: red;
    color: pink;
    font-weight: 700;

/* update color & background for hover date */
.slds-datepicker tbody>tr>td:hover span {
    background: red !important;

You must log in to answer this question.

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