Icons
About
Breeze Frontend uses Heroicons v1 icons. Each icon is declared as a LESS variable, so it’s very easy to replace them with any other svg icons.
Source code:
Usage
To use the icon, we provide a breeze-icon mixin. This mixin is coming with
built-in critical CSS support, so you don’t have to wrap it into @critical
guard:
selector::before { .breeze-icon(@icon-heart, @6); }
selector::before { .breeze-icon(@icon-s-home, @5); }
Icons
Outline
.breeze-icon(@icon, @6)
@icon-arrow-down
@icon-arrow-left
@icon-arrow-right
@icon-arrow-up
@icon-arrow-narrow-up
@icon-calendar
@icon-check
@icon-check-circle
@icon-chevron
@icon-exclamation-circle
@icon-eye
@icon-eye-off
@icon-filter
@icon-heart
@icon-home
@icon-information-circle
@icon-mail
@icon-menu
@icon-minus
@icon-minus-circle
@icon-minus-sm
@icon-pencil
@icon-plus
@icon-s-plus-circle
@icon-plus-sm
@icon-printer
@icon-question-mark-circle
@icon-refresh
@icon-scale
@icon-search
@icon-shopping-bag
@icon-shopping-cart
@icon-star
@icon-trash
@icon-user
@icon-user-circle
@icon-view-grid
@icon-view-list
@icon-x
@icon-x-circle
Solid
.breeze-icon(@icon, @5)
@icon-s-check
@icon-s-check-circle
@icon-s-exclamation-circle
@icon-s-filter
@icon-s-home
@icon-s-information-circle
@icon-s-minus
@icon-s-minus-circle
@icon-s-minus-sm
@icon-s-plus
@icon-s-plus-circle
@icon-s-plus-sm
@icon-s-printer
@icon-s-refresh
@icon-s-star