Icon on Base Toolkit - Version 2.10
Preview this component (CSS Classes; v2.3.0; 9/29/2021)
Guidelines using the component
Technical Information
This is a CSS class that is used to generate icons. These icons can be placed on your page. These icons use custom fonts and ligatures, so you can use them via CSS ligature (the name like admissions) or entites (the code like ). Names are preferred so screen readers will read them correctly. If you do use the raw entity, make sure you use an aria-described attribute for accessibility.
Because these are fonts, you can style them via CSS (color and font size).
Note that the il-icon and il-icon-line are two separate fonts, so some icons may not appear in one or the other.
How it looks
How it is built
Template -- enter raw HTML here
Custom Style Tag before text
Attributes
N/A
Class options
Styles
How to add it to your page
Copy and paste this in your page. Remember
- Make sure you have updated your component to make sure the below code is completed.
- Make sure you have the Header code in your header.
Note that this uses the custom style 'builder-custom'. You may need to change this if you are using multiple versions of this component with different styles.