Icon Reference

Font Awesome support in this site

This site is configured to load Font Awesome 6 Free. In practice, the icon prefixes that should just work here are:

  • fas for solid icons
  • far for regular icons
  • fab for brand icons

The site currently loads these bundles:

  • plugins/font-awesome/v6/solid.css
  • plugins/font-awesome/v6/regular.css
  • plugins/font-awesome/v6/brands.css
  • plugins/font-awesome/v6/icons.css

For this site, I would recommend staying with a fairly small visual vocabulary:

  • fas for navigation, platform, data, workflow, and interface icons
  • far for lighter utility and metadata icons
  • fab only for real company and platform brands

That keeps the site more coherent than pulling in arbitrary icons everywhere.

Use fas fa-...

fas fa-dna
fas fa-flask
fas fa-server
fas fa-sitemap
fas fa-table
fas fa-brain
fas fa-layer-group
fas fa-users-cog
fas fa-users
fas fa-search
fas fa-play
fas fa-arrow-right
fas fa-angle-left
fas fa-angle-right
fas fa-bars
fas fa-envelope
fas fa-bullhorn
fas fa-sync
fas fa-xmark
fas fa-file-signature
fas fa-signature

Use far fa-...

far fa-user-circle
far fa-calendar-alt
far fa-clock
far fa-dot-circle

Use fab fa-...

fab fa-linkedin
fab fa-linkedin-in
fab fa-github
fab fa-instagram
fab fa-facebook
fab fa-facebook-f
fab fa-twitter

These may technically exist in the current Font Awesome bundle, but I would avoid them for normal site work because they are visually weak, dated, overly specific, or inconsistent with the rest of the design:

  • fab fa-mixcloud
  • fas fa-fighter-jet
  • fas fa-dice
  • fas fa-dice-d6
  • fas fa-headphones-alt
  • fas fa-laptop-house
  • fas fa-thumbs-up
  • fas fa-tty

What Will Not Work By Default

The site does not currently load the Font Awesome Pro or extended style bundles. In practice, that means you should avoid relying on prefixes such as:

  • fal
  • fat
  • fad
  • fass
  • fasr

If you want those styles, the corresponding CSS bundles would need to be added explicitly.

Practical Rule

If you are editing page content or menu metadata in this site, the safest choices are:

  • fas fa-dna
  • fas fa-flask
  • fas fa-server
  • fas fa-sitemap
  • fas fa-table
  • fas fa-brain
  • fas fa-layer-group
  • fas fa-users-cog
  • far fa-user-circle
  • far fa-calendar-alt
  • far fa-clock
  • fab fa-linkedin
  • fab fa-github

That set is already in use across the site or sits comfortably beside the existing visual language.