Our Duotone icons, while extra stylish, need a little extra care when working on the Desktop.

Advertisement
Pro Plan Required

Pro Plan Required!

This is a Pro feature so you'll need to grab a Pro-level plan to use it. You'll also get thousands more icons, access to services, and support! Already got a plan? Sign in!

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.

You're viewing the Version 6 Beta

It's all the awesome of 5, but now more six-y! Version 6 brings over 13,000 icons across 5 styles – including the new Thin style! – and includes more and faster services.

Get the Deets on Version 6

Head Back to Our Current Version 5 Release

Need a Hand?

If you’re stuck or have a question, check our Troubleshooting docs, all of the Font Awesome threads on Stack Overflow, or contact our community on GitHub.

Or get Real Human Support™ with a Pro Subscription!