Our Duotone icons, while extra stylish, need a little extra care when working on the Desktop.
Our duotone style provides an alternate version of each Font Awesome icon, but with two distinct shades of color. They're great for adding brand colors or a more illustrative quality to the icons in your project.
We’ll cover the basics about what to consider when using duotone icons.
Considerations Before You Get Started
Duotone icons need some special attention when added into your designs, so look over the options and decide which is right for you.
| Method | Add as | The Good | The Ugly |
|---|---|---|---|
| Add as SVGs | Image file | Full control over color, styling, opacity for the entire icon as a unit or the layers individually. | Have to manually manage the icons in your design files. |
| Add Using Ligatures | Text box | Easiest way to add duotone icons - Just set the font to Font Awesome 6 Duotone and type the icon name. Lets you to change the font family to switch to a different style. | Can't adjust the color or opacity without first converting the icon to outlines. |
| Add Using Glyphs | Text box | Straightforward copy and paste of the primary or secondary glyphs from the icon details into a text box. | Need to align the two text boxes to combine the layers of the full icon. |