Font Awesome Pro Duotone icons
If you've enabled Font Awesome Pro and the Duotone Icon set, you can customize the two colors of Duotone icons.
The secondary icon's color will automatically have reduced opacity. Also, Duotone icons don't have different hover colors.
Where the duotone color settings appear and how the icons appear when these colors aren't set depends on the module.
| Module | Button behavior |
|---|---|
| Accordion | Set Duotone icon colors in the Icon section on the Style tab. If the Duotone icon color isn't set, and for other icons, color comes from the Text color setting in the Label section on the Style tab. If Text color isn't set, then the color of the label and the icon comes from the accent color set by your theme. |
| Button | Set Duotone icon colors in the Icon section of the Style tab. If the Duotone icon color isn't set, and for other icons, color comes from the Text color setting in the Text section on the Style tab. |
| Call to Action | Set Duotone icon colors in the Button icon section on the Button tab. The settings appear when you choose a Duotone icon. Other icons are controlled by the Button text color setting in the Button text section. |
| Callout | Set Duotone icon colors in the Icon colors section on the Image tab. You must select a Duotone icon for these settings to appear. Duotone icons are grayscale until the primary and secondary Duotone colors are set. Other icons are controlled by the Heading color setting in the Heading section on the Style tab. If that isn't set, color comes from your theme's heading color setting. |
| Contact Form, Subscribe Form | Set Duotone icon colors in the Button icon section on the Button tab. By default, the Duotone colors are grayscale. Other icons are controlled by the Button text color setting in the Button text section on the Button tab. |
| Content Slider | Set Duotone icon colors in the Button icon section on the Link tab of individual items. If the Duotone icon color isn't set, the icon appears in greyscale. Other icons are controlled by the Button text color setting in the Button text section of the Link tab. |
| Icon | Set Duotone icon colors in the Icon colors section on the Style tab. You must select a Duotone icon for these settings to appear. Duotone and other icons take on the text color set by your theme until specific icon colors are set. |
| Icon Group | Set Duotone icon colors in the Colors section on the Style tab of individual icons. You must select a Duotone icon for these settings to appear. If colors aren't set for the individual icon, they are controlled by the Color setting in the Icon colors section on the Style tab in the main module. |