How to add hover effect on button (dawn theme)

Hello Everyone!

I am using shopify dawn theme. I want to add hover effect to buttons on my entire website. Is it possible? Thank you.

Store: https://puppies-paws-shop.myshopify.com/

Password: Admin

Yes, you can add a hover effect to buttons across your entire website. Here’s how:

  1. Go to Online Store > Themes > Actions > Edit Code.
  2. In the Assets folder, open your base.css file.
  3. Add this code at the end
button:hover, .button:hover {
    background-color: #yourcolor; /* Change to your desired hover color */
    color: #yourtextcolor; /* Change to your desired text color on hover */
    transition: background-color 0.3s ease, color 0.3s ease;
}
​

Save the changes and refresh your site This will add a hover effect to all buttons on your website

2 Likes

How to add hover effect to the collection button?

Another thing, when I scroll the Variant picker and sort by it shows this blue color. I would like to change this color. Thank you so much.

I can also make a message with ChatGPT lol