Image Source

WordPress is one of the most popular methods used today to build and manage websites. With the help of this Content Management System (CMS), you can customize any website to speak up for your business, blog, portfolio, or online store. It is extremely flexible and easy to use, which is why it is the number one choice of people across the world.

Although it is pretty easy to use, there are various doubts and issues faced by users all over. If you are already part of this dynamic CMS platform, we are sure you must have also faced small hurdles in your journey. We are here to answer one such issue faced by users – how to change font color in WordPress header?

Changing header color in WordPress is extremely easy and only requires you to adjust the settings in the WordPress Customiser. However, there is one condition to this feature – it must be available in the theme that you have selected. In case the WordPress Customiser is not available in your theme, you can simply switch themes.

Are you still unsure? Let us closely look at the methods that will help you understand how to change font color in WordPress.

How to Change Header Color in WordPress

There may be several reasons for you to change your font color. Here are some simple and quick methods to figure out how to change font color in WordPress.

Method 1: Using the Visual Editor, also known as Gutenberg Editor

You can use a visual editor if you want to know how to change the font color in WordPress. Here is how the visual editor can be used easily to change the header font color:

Step 1: Log in to your WordPress Dashboard.

Step 2: Look for the post where you want to change the font color of the header.

Step 3: Click on the header of the post and look for the ‘Color Settings’ on the right-hand side of the screen.

Step 4: Go to ‘Background Color’ under the ‘Color Settings’. You will easily be able to change the color of the header.

There is also another way to change the font color of your header using the Visual Editor (Gutenberg Editor). You can follow these steps:

Step 1: Log in to WordPress Dashboard.

Step 2: Look for the post where you want to make changes to the font color of the header.

Step 3: Select the header text where you want to make changes.

Step 4: Click on the drop-down arrow.

Step 5: Click on the Text color option.

Step 6: Select the color of your choice. You will see that the changes have been implemented.

Image Source

Method 2: Using the Visual Editor, or the Classic Editor

If you have not yet switched from the Classic WordPress Editor, here is how to change font color in WordPress using the toolbar:

Step 1: Log in to your WordPress Dashboard.

Step 2: Look for the post where you want to make changes to the font color of the header.

Step 3: Select the header text where you wish to implement the changes.

Step 4: Go to the top toolbar. Here you will see an icon called ‘Toolbar Toggle’. Click on it to expand the toolbar.

Step 5: After doing this, click on ‘Text Color’. When you do this, you will see that there are several customization options available. You can choose the color from this palette, however, if you are unsatisfied, you can use custom colors. If you press the ‘X’ button in the bottom right corner, it will change the color to ‘no color’, thereby adjusting the text color automatically.

Step 6: If you know the hex code of the color you desire to use, you can use this to change the color.

Step 7: If you do not know the code, you can click on the ‘Custom’ button near the bottom of the menu.

Step 8: This opens up a square box with colors ranging from red to black. You will also notice a rectangular box with the colors of the rainbow. Here, you can choose your preferred color.

Step 9: If you wish to change the color visually, you can click anywhere on this rainbow box. The shade can also be changed by dragging it in this box. When you do this, the color of the black box changes to the color you are trying to make. When you are ready with the color, you will notice that an automatic code is generated at the top. You can keep this for reference purposes, in case you wish to match the other colors later on.

You can also select specific shades of red, green, and blue. To do this, you need to enter the values in the RGB boxes. To save the custom color, click Enter or the ‘OK’ button at the bottom. The custom color is not saved permanently, so if you wish to use it again, you need to go through the whole process.

Step 10: Finally, you can now see the change in color that you wanted to see on your selected text.

Image Source

Why is it important to select the right font colors for your website?

It is extremely important to look at the color scheme that is running through your website. It really is a make or break deal. Let us think of it as per real-life situations. Suppose you are in a crowded parking lot looking for your red car amidst a myriad of other red cars, you know how important color can be. Similarly, if you are only using black text against a white background without the use of other colors or highlights, it is possible that you are driving traffic away from your website. Customers want to look at something that catches their eye, black and white will simply not work to keep your customers interested in your website.

You also need to ensure that you are not going for excessive colors. Refrain from using extreme colors, such as maroon against a white background. Doing this can seriously hamper the readability and accessibility of your website.

When you are trying to see how to change font color in WordPress, make sure you are looking for something legible and easy for your visitors to read.

Choose colors that do not blend with your background. Instead, go for a color that stands out against the background of your website. If you have a light-colored background, choose a font color that is darker in shade and complements the background. The number one preference in such cases is the color black, but you can go for other darker alternatives as well.

If you have a darker background, do not opt for black, blue, or other darker shades as they will simply blend in with the background, making your text unreadable. To help your text stand out against the dark-colored background, make sure you are using a light color. White works best in such cases. It makes it easy to read the text.

Another important thing to note when you are looking to change the font color of your header, look for a consistent color scheme throughout your website. You also need to keep in mind your branding. If you have been using a specific color that speaks volumes of your brand and logo, we strongly suggest using the same color for your font. If that does not work out, you can use a color from the same color family. This ensures that there is some connection between your brand and the color scheme in the customer’s mind. Following this color scheme can really help people recognize your brand, business, or product. This also ensures that your website has more reader engagement.

Accessibility and Font Colors

When you are learning how to change font color in the WordPress website header, it is extremely crucial to keep in mind the accessibility guidelines. There are lawsuits concerning accessibility and it is important that you keep yourself protected.

Websites are considered to be public spaces, and so, you need to make sure that your website is easily accessible to the public. This only means that the font and colors you are choosing for your website are user-friendly and do not hamper the readability of the common public.

To ensure that you are adhering to the rules, you can follow the Web Content Accessibility Guidelines or WCAG. The WCAG has three levels of compliance that you can meet – A, AA, or AAA, with AAA being the highest level. Reaching these levels can make your website accessible to the widest audience.

You do not need to aim for AAA, clearing the AA level is enough for most websites. In order to get your AA level clearance, you need to ensure that the texts on your website meet all color contrast requirements.

AAA level is extremely strict and it requires you to use a dark color on a light background and vice versa.

Final Thoughts!

As a web designer, it is a very important thing to know how to change the font color of the header in WordPress. Knowing which colors to use and how to present it can make the website look extremely attractive.