Using icons on your website can help your site visitors to understand, navigate, and connect with your content.
We encourage SCEs to use Font Awesome icons for a consistent experience across K’s web presence. Font Awesome provides over 2000 free icons, ticking the boxes for our design goals of simplicity, clarity, and visual balance. As font icons, they can be sized and colored with our brand palette.
Popular Icons
envelope
phone
users
clock
arrow-up-right-from-square
circle-exclamation
location-dot
circle-question
calendar-days
clipboard-list
circle-user
user-graduate
How to Embed Icons
Icons can be added anywhere you can enter text, like a paragraph, heading, or link text. Use the [icon] shortcode to insert the icon at your cursor location.
Example:
[icon name="envelope" size="48px" ]
[icon name="facebook" style="brand"]
These attributes can be listed in any order after icon:
name = name of icon (required)
style = solid, regular or brand (optional, defaults to solid)
size= font size (optional, defaults to same size as surrounding text)
Tips
- Be consistent. Try to use each icon to signal the same meaning across on your website.
- We have access to the free icons only. If the style is referred to as “Pro”, e.g. “start using this Pro icon”, we don’t have access to it. Light, Thin and Duotone styles are Pro styles as of this writing.
- Use style=”brand” for commercial brand icons