Need help to customize variants button in Dawn theme Product page

[TheLivingCo]

Need help to customize variants button in Dawn theme Product page. I have shared the S.S. below like what i need to customize variants button.

[akshay_bhatt]

hi @TheLivingCo ,

it can be done by changing HTML and css code:

add HTML:

<button class="variant-button">{{ variant.title }}</button>

add css below:

.variant-button {
  border: none;
  padding: 10px 20px;
  cursor: pointer;
  transition: background-color 0.3s;
}

.variant-button:hover {
  background-color: #0000ff; /* Change to your desired hover color */
}

Got it! If you found my suggestions helpful, please consider liking or marking it as a solution.
Your feedback is appreciated! If you have any more questions or need further assistance, just let me know.

Regards

Akshay Bhatt

[TheLivingCo]

Hi Akshay,

where to add this code in liquid file