Speed Feed WordPress Theme

Change Button Color

To change the color of buttons in the Speed Feed WordPress theme, add the CSS for your desired colors to your site.

(How to add CSS to your site.)

Below are some sample colors. Note that each sample has the CSS code that you must add to your site to get that button color.

Sample Button Colors

Neutral

CSS

/* Neutral buttons color */

button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
	
	background-color: #e6e6e6;
	border-color: #ccc #ccc #bbb;

}
/* Neutral buttons hover,focus style */

button:hover, button:focus,
input[type="button"]:hover,
input[type="button"]:focus,
input[type="reset"]:hover,
input[type="reset"]:focus,
input[type="submit"]:hover,
input[type="submit"]:focus {
	
	border-color: #aaa #999 #333;

}

/* Neutral buttons active style */

button:active,
input[type="button"]:active,
input[type="reset"]:active,
input[type="submit"]:active {
    
    border-width: 2px;
    border-color: #333;

}

Yellow

CSS

/* Yellow buttons color */

button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
     
    background-color: #ffd659;
    border-color: #e5c050 #ccab47 #b2953e;
 
}

/* Yellow buttons hover,focus style */

button:hover, button:focus,
input[type="button"]:hover,
input[type="button"]:focus,
input[type="reset"]:hover,
input[type="reset"]:focus,
input[type="submit"]:hover,
input[type="submit"]:focus {
	
	border-color: #aaa #999 #333;

}

/* Yellow buttons active style */

button:active,
input[type="button"]:active,
input[type="reset"]:active,
input[type="submit"]:active {
    
    border-width: 2px;
    border-color: #333;

}

Updated on January 23, 2021

Questions and Comments are Welcome

Your email address will not be published. All comments will be moderated.

Please wrap code in "code" bracket tags like this:

[code]

YOUR CODE HERE 

[/code]