The “Accent Color” feature in Advanced Grid Builder (AGB) enhances the visual coherence between your grid and the overall aesthetics of your website. By altering the colour of specific components in your grid output, such as ‘More’ buttons, sort and filter widgets, and WooCommerce icons, you can achieve a harmonious blend with your existing theme colours.

How it Works

If you do not specify an accent colour, AGB attempts to fetch the accent colour of your currently installed theme. However, not all themes consistently use the same method for storing theme colours, so this feature may not work for all themes. If this is the case, AGB will use a default colour instead.

How to Override the Default Colour

To override the default colour for any grid, you can enter a colour value in the Accent Colour input field. This field accepts any CSS colour property value. Here are some examples:

Note: Colour values should be in the exact format they would be added as a css property, so for example ‘rgb(0,0,0)’ not ‘0,0,0’.

For example, in the following demo the accent color has been set to red.


AGB Theme v6.3.0
Postgrid ID
Accent Colour
Odd Colour
Even Colour
ID of agb to copy
ID to send to the cloud
ID to retrieve from the cloud
Grid type
antique military leather boots

Antique Military Leather Boots

assorted sea shells sourced from Northern Territory found C.1920

Assorted Sea Shells


Why Use the Accent Colour Feature?

By using the Accent Colour feature, you can ensure that the colours used in your grid align well with the rest of your website, including brand colours. This contributes to a more seamless and professional appearance, and can also improve user experience by providing visual consistency.