Chosen Pro allows you to change the colors of your site. To change the color of an element on your site:
- Visit the Customizer (Appearance → Customize)
- Click on the Colors section
- Select the section you would like to edit
- Locate the element you want to edit, and click on the color picker
- Use the color picker to select a color
- When you're happy with your colors, click the Save & Publish button to save your changes
The colors on your site have now been updated
Using the Color Picker
The color picker has a lot of functionality built into its interface. Let's go over the various tools in the color picker now:
The color picker includes a few default colors at the bottom:
Click on one to select it as your new color. This can be helpful to use as a starting point for your custom color
You can use the color region to adjust the hue and brightness of your color. Moving the selector left and right will adjust the hue, and moving it up and down will change the brightness.
To move the selector, you can click and drag it, or you can click on it and use the arrow keys on your keyboard to fine-tune its position
On the right-side of the color picker is the saturation slider. Click and drag the slider up to increase the saturation of the color, and drag down to reduce the saturation.
Hexadecimal color code input
A hexadecimal color code is the fancy term for color codes like this: #43b3c4. That's the blue we use at Compete Themes. This is white: #ffffff and this is black: #000000
You don't need to use this option at all if you don't want to. However, it is extremely useful if you have a color somewhere else online and you want to use the exact same color.
Just enter in the color code you want to use, and the color will automatically update.