Iconography for use in your projects!
Whilst we make use of icons from various sources we no longer blanket include either Glyphicons or Font Awesome icons. Instead we’ve constructed a custom font via IcoMoon so that we load only icons which are relevant to what we need.
The markup and style code is the same as Font Awesome (<3) though the intention is that BEM classes are used and any required icons would be @extended within the SCSS.
The CRUKIcons font is created via the IcoMoon app, if you wish to add more icons then you can import the config.json to do so.
Icon markup
<i class="cr-i cr-i--chevron-left" aria-hidden="true"></i>
The icons
example of .cr-i--chevron-left
example of .cr-i--chevron-right
example of .cr-i--chevron-up
example of .cr-i--chevron-down
example of .cr-i--times
example of .cr-i--pencil-square
example of .cr-i--plus
example of .cr-i--plus-2
example of .cr-i--minus
example of .cr-i--minus-2
example of .cr-i--link
example of .cr-i--search
example of .cr-i--checkmark
example of .cr-i--check-circle
example of .cr-i--credit-card
example of .cr-i--eye
example of .cr-i--ticket
example of .cr-i--info
example of .cr-i--warning
example of .cr-i--info
example of .cr-i--square
example of .cr-i--checkbox-checked
example of .cr-i--checkbox-unchecked
example of .cr-i--radio-unchecked
example of .cr-i--radio-checked
example of .cr-i--radio-checked2
example of .cr-i--print