Icon sets
Overview
Limitless includes 4 icon sets: Phosphor, Icomoon, Fontawesome and Material Design. Default icon set in Limitless 4.0 is Phosphor Regular, which includes 1000+ icons. Icomoon set, which was the default in previous versions is now optional.
Phosphor Icons
Phosphor icon set is the default set in Limitless template. It's
also available in 6 weights: thin, light, regular, bold, fill and duotone. We
are using Regular weight as it fits best in the UI. Phosphor icon set includes
~1100 icons and is based on 16px grid, meaning you can use 4px step to make them
look sharp. Default icon size is 20px. Icon class names start with
.ph- prefix.
Folder structure :-
Phosphor Icons are used as scss based here, and the code is written in phosphor folder
Example :-
<i className="ph-*-*"></i>
Icomoon Icons
Icomoon Icons over 5000 open source and free icons available in IcoMoon's library, and by allowing you to generate crisp icon fonts and SVG sprites locally/offline, this service is far ahead of any similar one.
Icon class names start with .icon- prefix.
Folder structure :-
icomoon Icons are used as scss based here, and the code is written in icomoon folder
Example :-
<i className="icon-*-*"></i>
Fontawesome Icons
Font Awesome set includes 1500+ icons from version 5. This famous
icon set also includes brand icons and come in 2 styles: regular and solid. Font
Awesome icons are based on 14px grid and best font size for them is 14px (28px,
42px, 58px etc). This library is in active development and I'll be updating it
on regular basis. Icon class names start with .fa- prefix and have
additional class names: fab - brand icons, far
- outline icons, fas - solid icons.
Folder structure :-
Fontawesome Icons are used as scss based here, and the code is written in fontawesome folder
Example :-
<i className="fab-*-*"></i>
Material Design Icons
Material Design icon is a part of Material design language created
by Google a while ago. It includes 845 icons in a solid style. All icons are
based on 24px grid, but they also look great in 16px and 20px sizes. Icon class
names start with .mi- prefix.
Folder structure :-
Material Icons are used as scss based here, and the code is written in material folder
Example :-
<i className="mi-*-*"></i>