Icons from web

Instalation

• Via NPM

  $ npm install @adereksisusanto/icons
  

• Via Composer

  $ composer require adereksisusanto/icons
  

Use

<!-- Online -->
<!-- All Icons -->

<link
  rel="stylesheet"
  href="https://cdn.jsdelivr.net/npm/@adereksisusanto/icons@1.0.6/dist/css/all.icons.min.css"
/>

<!-- Local -->
<!-- All Icons -->
<link
  rel="stylesheet"
  href="node_modules/@adereksisusanto/icons/dist/css/all.icons.min.css"
/>

Fonts

Package	Version	Docs
Bootstrap Icons	1.4.0	Read Docs
Crypto Icons	1.0.65	Read Docs
Feather Icons	4.28.0	Read Docs
Flag Icons	3.5.0	Read Docs
Fontawesome Free [Updated]	5.15.3	Read Docs
Ion Icons [Updated]	5.5.1	Read Docs
Line Awesome [New]	1.3.0	Read Docs
Material Design Icons	5.9.55	Read Docs
Material Icons	0.5.4	Read Docs
Simple Line Icons	2.5.5	Read Docs
Themify Icons	1.0.1-alpha.3	Read Docs
Weather Icons	1.3.2	Read Docs

Bootstrap Icons

<!-- Online -->
<link
  rel="stylesheet"
  href="https://cdn.jsdelivr.net/npm/@adereksisusanto/icons@1.0.6/dist/css/bootstrap.icons.min.css"
/>

<!-- Local -->
<link
  rel="stylesheet"
  href="node_modules/@adereksisusanto/icons/dist/css/bootstrap.icons.min.css"
/>

<!-- Use -->
<i class="bi bi-alarm-fill"></i>

Crypto Icons

<!-- Online -->
<link
  rel="stylesheet"
  href="https://cdn.jsdelivr.net/npm/@adereksisusanto/icons@1.0.6/dist/css/crypto.icons.min.css"
/>

<!-- Local -->
<link
  rel="stylesheet"
  href="node_modules/@adereksisusanto/icons/dist/css/crypto.icons.min.css"
/>

<!-- Use -->
<i class="ci ci-byts"></i>

Feather Icons

<!-- Online -->
<link
  rel="stylesheet"
  href="https://cdn.jsdelivr.net/npm/@adereksisusanto/icons@1.0.6/dist/css/feather.icons.min.css"
/>

<!-- Local -->
<link
  rel="stylesheet"
  href="node_modules/@adereksisusanto/icons/dist/css/feather.icons.min.css"
/>

<!-- Use -->
<i class="feather feather-activity"></i>

Flag Icons

<!-- Online -->
<link
  rel="stylesheet"
  href="https://cdn.jsdelivr.net/npm/@adereksisusanto/icons@1.0.6/dist/css/feather.icons.min.css"
/>

<!-- Local -->
<link
  rel="stylesheet"
  href="node_modules/@adereksisusanto/icons/dist/css/feather.icons.min.css"
/>

<!-- Use -->
<i class="flag-icon flag-icon-id"></i>
<i class="flag-icon flag-icon-id flag-icon-squared"></i>

Fontawesome Free

<!-- Online -->
<link
  rel="stylesheet"
  href="https://cdn.jsdelivr.net/npm/@adereksisusanto/icons@1.0.6/dist/css/fontawesome.icons.min.css"
/>

<!-- Local -->
<link
  rel="stylesheet"
  href="node_modules/@adereksisusanto/icons/dist/css/fontawesome.icons.min.css"
/>

<!-- Use -->
<i class="fab fa-500px"></i>

Ion Icons

<!-- Online -->
<link
  rel="stylesheet"
  href="https://cdn.jsdelivr.net/npm/@adereksisusanto/icons@1.0.6/dist/css/ion.icons.min.css"
/>

<!-- Local -->
<link
  rel="stylesheet"
  href="node_modules/@adereksisusanto/icons/dist/css/ion.icons.min.css"
/>

<!-- Use -->
<i class="ionicons ionicons-accessibility"></i>

Line Awesome

<!-- Online -->
<link
  rel="stylesheet"
  href="https://cdn.jsdelivr.net/npm/@adereksisusanto/icons@1.0.6/dist/css/lineawesome.icons.min.css"
/>

<!-- Local -->
<link
  rel="stylesheet"
  href="node_modules/@adereksisusanto/icons/dist/css/lineawesome.icons.min.css"
/>

<!-- Use -->
<i class="las la-battery-three-quarters"></i>

Material Design Icons

<!-- Online -->
<link
  rel="stylesheet"
  href="https://cdn.jsdelivr.net/npm/@adereksisusanto/icons@1.0.6/dist/css/material-design.icons.min.css"
/>

<!-- Local -->
<link
  rel="stylesheet"
  href="node_modules/@adereksisusanto/icons/dist/css/material-design.icons.min.css"
/>

<!-- Use -->
<i class="mdi mdi-ab-testing"></i>

Material Icons

<!-- Online -->
<link
  rel="stylesheet"
  href="https://cdn.jsdelivr.net/npm/@adereksisusanto/icons@1.0.6/dist/css/material.icons.min.css"
/>

<!-- Local -->
<link
  rel="stylesheet"
  href="node_modules/@adereksisusanto/icons/dist/css/material.icons.min.css"
/>

<!-- Use -->
To display an icon, use:

<span class="material-icons">home</span>
To display outlined, round, sharp and two tone icons, use:

<span class="material-icons-outlined">home</span>
<span class="material-icons-round">home</span>
<span class="material-icons-sharp">home</span>
<span class="material-icons-two-tone">home</span>

Simple Line Icons

<!-- Online -->
<link
  rel="stylesheet"
  href="https://cdn.jsdelivr.net/npm/@adereksisusanto/icons@1.0.6/dist/css/simple-line.icons.min.css"
/>

<!-- Local -->
<link
  rel="stylesheet"
  href="node_modules/@adereksisusanto/icons/dist/css/simple-line.icons.min.css"
/>

<!-- Use -->
<i class="sli-user"></i>

Themify Icons

<!-- Online -->
<link
  rel="stylesheet"
  href="https://cdn.jsdelivr.net/npm/@adereksisusanto/icons@1.0.6/dist/css/themify.icons.min.css"
/>

<!-- Local -->
<link
  rel="stylesheet"
  href="node_modules/@adereksisusanto/icons/dist/css/themify.icons.min.css"
/>

<!-- Use -->
<i class="ti ti-arrow-up"></i>

Weather Icons

<!-- Online -->
<link
  rel="stylesheet"
  href="https://cdn.jsdelivr.net/npm/@adereksisusanto/icons@1.0.6/dist/css/weather.icons.min.css"
/>

<!-- Local -->
<link
  rel="stylesheet"
  href="node_modules/@adereksisusanto/icons/dist/css/weather.icons.min.css"
/>

<!-- Use -->
<i class="wi wi-day-cloudy-gusts"></i>

Change Log

• Read
  • v1.0.6
  • v1.0.5
  • v1.0.4
  • v1.0.3
  • v1.0.2
  • v1.0.1
  • v1.0.0

License