Skip to content

FontAwesome icon support only includes fas (solid) icons, missing fab (brands) for social login providers #19517

@chriselsen

Description

@chriselsen

Describe the bug

The FontAwesome icon support introduced in PR #19233 (commit d949564) only supports fas (FontAwesome Solid Classic) icons but does not support fab (FontAwesome Brands) icons. This severely limits the usefulness of the feature since most social login providers (Google, LinkedIn, Facebook, Twitter, etc.) use brand icons from the fab icon set.

How to reproduce

  1. Go to Admin Interface → Applications → Providers → Social Login Provider
  2. Try to set a FontAwesome brand icon (e.g., fa://fa-google, fa://fa-linkedin, fa://fa-facebook)
  3. The icon will not display correctly because the code hardcodes fas class instead of allowing other icon families

Expected behavior

The FontAwesome icon support should allow manual specification of different FontAwesome icon families, such as:

  • fas - FontAwesome Solid Classic
  • fab - FontAwesome Brands (essential for social login providers)
  • far - FontAwesome Regular
  • fal - FontAwesome Light (if available)

For example, allow syntax like fa://fab/fa-google or fa://fa-brands/fa-linkedin to manually specify the icon family.

Screenshots

Current code in web/src/elements/utils/images.ts line 35 hardcodes fas:

const classes = [className, "font-awesome", "fas", src.slice(FontAwesomeProtocol.length)]

Additional context

Social login providers typically use brand icons:

  • Google: fa-google (fab)
  • LinkedIn: fa-linkedin (fab)
  • Facebook: fa-facebook (fab)
  • Twitter/X: fa-twitter (fab)
  • GitHub: fa-github (fab)

While some social login providers already have icons included in Authentik, many others (e.g., LinkedIn) do not, making FontAwesome brand icons the only viable option for consistent branding.

Deployment Method

Docker

Version

2025.12.1

Relevant log output

No relevant log output - this is a frontend icon rendering limitation.

Metadata

Metadata

Assignees

Labels

enhancement/confirmedEnhancements that will be implemented in the future

Projects

Status

Todo

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions