CSS Selectors For Custom WooCommerce Button Color

1. Override the WooCommerce purple button color with these CSS selectors. Replace #00ff80 on line 4 with your custom color code:

   .woocommerce #respond input#submit,.woocommerce a.button, .woocommerce button.button, .woocommerce input.button,
   .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt {
   
         background-color: #00ff80;
   
   }
   
   

2. Override the WooCommerce purple button hover color with these CSS selectors. Replace #000 on line 6 with your custom color code:

   .woocommerce #respond input#submit:hover,.woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover,
   .woocommerce #respond input#submit.alt:hover, .woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce button.button.alt:active, .woocommerce input.button.alt:hover,
   .woocommerce button.button.alt:disabled[disabled],
   .woocommerce button.button.alt:disabled[disabled]:hover {
   
         background-color: #000;
   
   }
   

You can see this for some sample css colors inspiration.