Icon SCSS
icons.scss is source file for the all custom icon plugins.
<!-- icons CSS -->
<link rel="stylesheet" href="assets/css/icons.min.css">
Unicons Official Website
Bring your designs to life with free icon fonts, SVG icons, 3D icons and animated icons with Unicons by IconScout. Whether you’re a designer or developer, Unicons has you covered with high-quality icons in a variety of icon styles such as line, monochrome, solid and thin line.
SCSS File:
Unicons are scss based here.where Unicons code is
written in _unicons.scss
<!-- Unicons scss -->
@import "custom/plugins/icons/_unicons";
Example:
<i class="uil-amazon"></i> Box iconsOfficial Website
Boxicons is a free collection of carefully crafted open source icons.Each icon is designed on a 24px grid with the material guidelines.
SCSS File:
Remix icons are scss based here.where remix icon code is written in _boxicon.scss
<!-- box icon scss -->
@import "custom/plugins/icons/boxicons";
Example:
<i class="bx bx-**"></i>DripiconsOfficial Website
Dripicons Icon Set is an Icon Set of 200 icons. Each icon is solid, which is useful for changing icon colors. It's been open sourced with the license: Creative Commons Attribution 4.0 International. All icons can be used for personal & commercial purposes. Use them with or without Bootstrap in any project.
SCSS File:
Dripicons are scss based here. Where Dripicons code is written in _dripicons.scss
<!-- Dripicons scss -->
@import "custom/plugins/icons/_dripicons";
Example:
<i class="dripicons-*-*"></i>Material Design IconsOfficial Website
Material design icons is free. Material Design Icons | Figma Community Our icons are free for everyone to use. It's available under Apache license version 2.0. In this file, over 2000 Material Design icons are built as components in 5 variants: Filled, Outlined, Sharp, Rounded, Two-tone. You can access our icons directly on fonts.google.com/icons.
SCSS File:
Material Design Icons are scss based here. Where Material Design Icons code is written in _materialdesignicons.scss
<!-- Material Design Icons scss -->
@import "custom/plugins/icons/_materialdesignicons";
Example:
<i class="mdi mdi-*-*"></i>Fontawesome iconsOfficial Website
Font Awesome is designed to be used with inline elements. The <i> and <span> elements are widely used for icons. Also note that if you change the font-size or color of the icon's container, the icon changes. Same things goes for shadow, and anything else that gets inherited using CSS.
SCSS File:
Fontawesome icons are scss based here.where Fontawesome icon code is written in _fontawesome-all.scss
<!-- Fontawesome icon scss -->
@import "custom/plugins/icons/_fontawesome-all";
Example:
<i class="far fa-**"></i>