Modifying Color Picker Options
The color selections in the Color Picker tool is powered by a single CSS file.
Each color option is defined with a "variable" that exists inside comments in the CSS code.
To modify the options, follow these steps:
1. Find and edit the file "override.css", most often found in "_assets/css/".
2. Check the top of the override file. At the top of the file, all color options are defined, one per line:
/* $<VARIABLE NAME>, <TYPE>, <LABEL NAME> */
3. To add a new color, make a new line there. Here's an example:
/* $accent4, color, Footer Links 2 */
4. Define the CSS selectors for which this color is applied in a new block of CSS code. Inside the curly braces of this block, add the color's VARIABLE NAME before any rules:
#footer-links,
#footer-links a {
/* $accent4 */
color: #ffffff;
}
5. Save the "override.css" file and test your changes on the site.