Adding Custom Colors to WordPress

WordPress does a good job at managing your theme keeping your website colors consistent through cascading style sheets (CSS). But how do you change the color of something to a custom color using a customized CSS tag instead of a standard HTML tag? It’s pretty easy.
Log into your wordpress and choose a page or post to edit, click edit, and then in the menu click Appearance – Customize – Additional CSS – and outside of the comment block enter something like

p.whitetext{
color: white;
}

And now you can go back to the page you want to add the white text to and edit it and click text editing instead of visual and add a line like…
<p class=”whitetext”>This text will be white</p>
And there you go.
If you want a color change for a standard paragraph to be site-wide try adding instead of p.whitetext etc. use this line in your css change…

p {
color: red;
}

And now every paragraph site-wide appears red. So easy.

Standard font change would be…

body{
font-family: verdana;
}

To change the background color of paragraphs…

p{background-color: powderblue;}

To change the background color of every page try…

#main {
background-color: #5b202c;
}

Or a combination like…

body{
font-family: verdana;
}
#main {
background-color: #5b202c;
}

Or if you want to change just the background color of a single page find the page id number by going to the page and clicking edit and look at your browser’s address bar and look at the number there post = “1234” for instance and then add this line to the custom CSS

.page-id-1234 #main {
background-color: #2b302c;
}

or you can use color names instead of hexcode like this.

.page-id-1234 #main {
background-color: green;
}

If you just use…

#main {
background-color: green;
}

then all backgrounds for all pages will be the same.