Skip to main content

Icons

Icons system​

Icon font are generated using https://icomoon.io/app/#/select.

Icons can be call in the markup using a class .icon-{target}, such as <i class="icon-star" aria-hidden="true" ></i>.

It can be call using span or div as well.

Example:​

bcc-font_link bcc-font_external-link bcc-font_cheveron-right bcc-font_menu bcc-font_search bcc-font_buspass bcc-font_counciltax bcc-font_feedback bcc-font_foi bcc-font_parking bcc-font_registerbirth bcc-font_cross bcc-font_verified bcc-font_download font_user-add bcc-font_bin bcc-font_alert bcc-font_user bcc-font_pdf bcc-font_up bcc-font_left bcc-font_down bcc-font_right bcc-font_cancel bcc-font_tick bcc-font_blockquote bcc-font_calendar bcc-font_phone bcc-font_info bcc-font_help bcc-font_location bcc-font_new-window bcc-font_printer bcc-font_clock bcc-font_settings bcc-font_eye bcc-font_eye-blocked bcc-font_notification
bcc-font_nextdoor bcc-font_youtube1 bcc-font_facebook bcc-font_instagram bcc-font_x bcc-font_pinterest bcc-font_linkedin 
<i class="bcc-font_link" aria-hidden="true"></i>
<i class="bcc-font_external-link" aria-hidden="true"></i>
<i class="bcc-font_cheveron-right" aria-hidden="true"></i>
<i class="bcc-font_menu" aria-hidden="true"></i>
<i class="bcc-font_search" aria-hidden="true"></i>
<i class="bcc-font_buspass" aria-hidden="true"></i>
<i class="bcc-font_counciltax" aria-hidden="true"></i>
<i class="bcc-font_feedback" aria-hidden="true"></i>
<i class="bcc-font_foi" aria-hidden="true"></i>
<i class="bcc-font_parking" aria-hidden="true"></i>
<i class="bcc-font_registerbirth" aria-hidden="true"></i>
<i class="bcc-font_cross" aria-hidden="true"></i>
<i class="bcc-font_verified" aria-hidden="true"></i>
<i class="bcc-font_download" aria-hidden="true"></i>
<i class="bcc-font_user-add" aria-hidden="true"></i>
<i class="bcc-font_bin" aria-hidden="true"></i>
<i class="bcc-font_alert" aria-hidden="true"></i>
<i class="bcc-font_user" aria-hidden="true"></i>
<i class="bcc-font_account" aria-hidden="true"></i>
<i class="bcc-font_pdf" aria-hidden="true"></i>
<i class="bcc-font_up" aria-hidden="true"></i>
<i class="bcc-font_left" aria-hidden="true"></i>
<i class="bcc-font_down" aria-hidden="true"></i>
<i class="bcc-font_right" aria-hidden="true"></i>
<i class="bcc-font_cancel" aria-hidden="true"></i>
<i class="bcc-font_tick" aria-hidden="true"></i>
<i class="bcc-font_blockquote" aria-hidden="true"></i>
<i class="bcc-font_calendar" aria-hidden="true"></i>
<i class="bcc-font_phone" aria-hidden="true"></i>
<i class="bcc-font_info" aria-hidden="true"></i>
<i class="bcc-font_help" aria-hidden="true"></i>
<i class="bcc-font_location" aria-hidden="true"></i>
<i class="bcc-font_new-window" aria-hidden="true"></i>
<i class="bcc-font_printer" aria-hidden="true"></i>
<i class="bcc-font_clock" aria-hidden="true"></i>
<i class="bcc-font_settings" aria-hidden="true"></i>
<i class="bcc-font_eye" aria-hidden="true"></i>
<i class="bcc-font_eye-blocked" aria-hidden="true"></i>
<i class="bcc-font_notification" aria-hidden="true"></i>
<i class="bcc-font_nextdoor" aria-hidden="true"></i>
<i class="bcc-font_youtube1" aria-hidden="true"></i>
<i class="bcc-font_facebook" aria-hidden="true"></i>
<i class="bcc-font_instagram" aria-hidden="true"></i>
<i class="bcc-font_x" aria-hidden="true"></i>
<i class="bcc-font_pinterest" aria-hidden="true"></i>
<i class="bcc-font_linkedin" aria-hidden="true"></i>