Font Awesome Icon Use

USU has purchased a license that allows us to use the Font Awesome Pro library within Omni CMS.

Limitations

To ensure that USU websites meet accessibility and user experience best practices and maintain the integrity of the USU web template, some Font Awesome Pro features are disabled as follows:

  • Animations
  • Color styles

Also, please be aware that if you use Font Awesome code outside a component, and add it to your WYSIWYG editor, you are likely to have it break when you edit the page. To keep this from happening, please use one of the available Font Awesome components or a source code asset when using the Font Awesome code.

How to Use

Font Awesome icon code is best used inside Omni CMS using one of our available Font Awesome components or inside a source code asset.

  • Card - Font Awesome Icon Card (BS4)
  • Font Awesome Icon (BS4)
  • Inline Alert (not available to all editors)

Icon Use Best Practices

Icons are great way to draw attention to your content and make it quickly digestible by your audience. But too much of a good thing, or inconsistent use of a good thing can be a jarring and poor user experience. To avoid those issues, please consider the following:

  • Use the same icon family and style across your site (e.g. classic or sharp; solid, regular, light or duotone)
  • Avoid using duotone icons
  • Use icons consistently (e.g. use the same icon for form wherever you use it or use the same icon for calendar wherever you use it, even on different pages)
  • Use default sizing to your icons in components since responsive and consistent styling is applied in the component itself
  • Do not overuse icons; use a few key icons to convey a consistent message