Skip to main content

Introducing Sharp Duotone

Always two there are.


Sharp icons are a great design choice when you’re looking to class up your project for a sleek, professional look and feel.

As you may have noticed, this year (and last) we’ve rolled out Sharp Solid, Regular, Light, Thin and now we’re proud to announce the final installment — drumroll please — Sharp Duotone!

That frog has seen some things

If you are what you eat, then I only want to eat the good stuff

Accessorize with Understated Icon Flair in Your Project

Jump to section titled: Accessorize with Understated Icon Flair in Your Project

If the Sharp Family is like the tuxedo of icons, Sharp Duotone is like the perfect accessory to add extra dimension with two layers, and near infinite possibilities when you need an illustrated look for big impact. Duotone is sort of like the subtle (or not so subtle) bling that takes your look to the next level.

There really should be more intelligence-based classes

Design with a Splash of Color

Jump to section titled: Design with a Splash of Color

Like all our Font Awesome icons, Duotone automatically inherits CSS size and color, and consists of a primary and secondary layer. By default, the secondary layer is given an opacity of 40%, so that it appears as a lighter shade of the icon’s inherited or directly-set color. Learn more

Let there be layers

Light or Dark, Duotone Looks Great on Contrasting Backgrounds

Jump to section titled: Light or Dark, Duotone Looks Great on Contrasting Backgrounds

Do you need your icons to work in reverse, on a dark background? Duotone is a great choice.  This works out-of-the-box because Duotone features two layers — one primary, one secondary. This allows it to retain the same color as the primary layer, but also visually mix it with the underlying background color.

But Sharp Duotone icons are only available with a Pro subscription.

Monkey see, monkey do(utone)

Along with Sharp icons, your Pro subscription includes access to Font Awesome Classic with multiple icon styles to choose from, including:

  • Solid — Make a bold statement, even in small sizes.
  • Regular — Smooth out your design with easygoing, readable icons.
  • Light — Turn down the tone just a smidgen for when you need a lighter touch.
  • Thin — Style your site with the latest super-light designs.
  • Duotone — Go big with an illustrated feel by adding a pop of color.

You also get more Kits, pageviews, custom icon upload, Actual Human™ Support, and more!

Get Font Awesome Pro!