Bug: font-awesome icon in Duotone style is messed up

[randomguy-2650]

note: this has been edited multiple times

Bug description

There are many styles of the Font Awesome icon (font-awesome) including Sharp, but Duotone is very messed up. Take a close look in the blue circle, that's where the messed up Duotone icon is.

Reproducible test case

https://codepen.io/randomguy-2650/pen/OJGbZjp

Screenshots

---

Version 6.0.0

Version 6.1.0 and later (6.1.0–6.5.1)

Font Awesome version

v6.1.0 to v6.5.1, v6.5.2 has the same issue but looks differently

Serving

Kit, Font Awesome CDN, Self-hosted

Implementation

CSS, SVG Sprites(?)

Browser and operating system

• All browsers on all operating systems, even mobile devices.

Web bug report checklist

• I have included a test case because my odds go way up that the team can fix this when I do
• I have searched for existing issues and to the best of my knowledge this is not a duplicate

[randomguy-2650]

UPDATE

This is the updated version.

This only applies to version 6.1.0 and later. It didn't apply to version 6.0.0. The multiple styles was a misunderstanding by me, just the Duotone is messed up for the font-awesome icon.

[randomguy-2650]

note: this doesn't apply to the desktop version of font awesome, only the web.

[sensibleworld]

Confirmed that this is an issue. We're looking into a fix! It affects any brand icon that is also a standard icon.

[randomguy-2650]

It applies to all methods that use Web Fonts + CSS. SVG + JS does NOT have this issue.