Colours

This page covers the colour palette used for the theme and how to change them. The colour system is site-wide, which means changing these will affect the entire site.

The "Colors" panel

The "Colors" panel is where you can customize the colour palette used throughout the design. Aubrey uses Bootstrap 5 as the CSS framework which includes colours ranging from dark to light, and the greys in between. Use the colour picker on each setting to change and tweak any of the following colours.

• Background Color - This is a default WordPress setting and is the main background colour of your site.

• Accent - This colour is used sparingly throughout the site, including links and some hover states. Ideally, this should match your branding's main colour.

• Black, Gray 100-900, White - These colours go from dark to light and each one is used for different purposes. E.g. gray-100 is used for subtle border colours on some elements.

Don't forget, colours on specific elements can be customized individually in the Typography & Styling panel.

Tip: These colours are also available in the block editor too. So updates here will reflect the ones in the block editor!