In this video you’re going to learn how to change the text colors for your entire website in one quick and easy lesson.

Some themes use light gray for the text color which can be hard to read. I also find that harsh black is not easy on the eyes either. So I like to use dark gray.

Here’s a few shades to choose from.

#404040
#333333
#262626
#1a1a1a

And you can jazz things up a bit by using a different color for your headings. Please choose one color for all your headings, don’t mix them up. Two text colors on one page looks good but three is meh!

Here's the Code:

For normal Paragraph text, Bullet Lists, and Numbered Lists

p {color: #1a1a1a;} ul {color: #1a1a1a;} ol {color: #1a1a1a;}

For Headings

H1 {color: #ff0066;} H2 {color: #ff0066;} H3 {color: #ff0066;

H1 {color: #00ff00;} H2 {color: #00ff00;} H3 {color: #00ff00;}

To find the hex values for your favorite hues use the colors picker at W3Schools Colors Picker

Related Training:

Custom CSS: Change Font Size Site-Wide

Custom CSS: Change Font Family Site-Wide

Custom CSS: Change Link Color Site-Wide

Training by Marion Black - Sorted

As always, I'm here to help you,

Please share the love, click 'Like This' (if you do). Ask a question, share something or leave a comment.