Identify Elements in Color Palette

Thank you for your question, Carlos. To identify what elements are associated, you can view the themes SCSS file. You can find all of our themes on GitHub, which will show the relationship between the elements and what color they are assigned to.

You can view an example of that relationship here, in one of our newer themes, Swifty.

You can reference the color configuration documentation for further explanation of how it is applied within the theme itself.

The neutral color will always be the last color in the palette, and it is set within the themes config.php file.. An example of that can be found here within the themes configuration file.

This array would produce the color palette I have attached underneath of the code.:

array(
                        'default' => true,
                        'format' => 'palette-primary',
                        'neutral-color' => '#ffffff',
                        'colors' => array(
                                '#ca5215',
                                '#333333',
                                '#ca5215',
                                '#333333',
                                '#000000',
                        ),
                ),

When the SCSS compiles, it writes to css/color-palettes.css within the theme itself. This occurs whenever you make a change in the Customizer.

I will add a feature request to our planning board. The biggest obstacle would be figuring out the best place to display information like this.

You also have the option of using FireFox or Chrome, and their developer tools to view the styling, and color associated. Here is some information regarding using those.

https://developer.mozilla.org/en-US/docs/Tools

https://developer.chrome.com/devtools