@ng-icons/simple-icons 14.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +104 -0
- package/esm2020/index.mjs +2170 -0
- package/esm2020/ng-icons-simple-icons.mjs +5 -0
- package/fesm2015/ng-icons-simple-icons.mjs +2176 -0
- package/fesm2015/ng-icons-simple-icons.mjs.map +1 -0
- package/fesm2020/ng-icons-simple-icons.mjs +2176 -0
- package/fesm2020/ng-icons-simple-icons.mjs.map +1 -0
- package/index.d.ts +2169 -0
- package/ng-icons-simple-icons.d.ts +5 -0
- package/package.json +36 -0
package/README.md
ADDED
|
@@ -0,0 +1,104 @@
|
|
|
1
|
+
<img width="847" alt="logo" src="https://user-images.githubusercontent.com/20795331/142078474-da890691-b524-4144-9640-2f7f9da3a3a3.png">
|
|
2
|
+
|
|
3
|
+
# Ng Icons
|
|
4
|
+
|
|
5
|
+
The all-in-one icon library for Angular. This allows you to use icons from multiple icon sets with a single icon component.
|
|
6
|
+
Containing almost 18,000 icons for you to use in your projects.
|
|
7
|
+
|
|
8
|
+
Currently, we support the following libraries:
|
|
9
|
+
|
|
10
|
+
- [Bootstrap Icons](https://icons.getbootstrap.com/)
|
|
11
|
+
- [Heroicons](https://heroicons.com/)
|
|
12
|
+
- [Ionicons](https://ionic.io/ionicons)
|
|
13
|
+
- [Material Icons](https://fonts.google.com/icons?selected=Material+Icons)
|
|
14
|
+
- [CSS.gg](https://css.gg/)
|
|
15
|
+
- [Feather Icons](https://feathericons.com/)
|
|
16
|
+
- [Jam Icons](https://jam-icons.com/)
|
|
17
|
+
- [Octicons](https://github.com/primer/octicons)
|
|
18
|
+
- [Radix UI Icons](https://icons.modulz.app/)
|
|
19
|
+
- [Tabler Icons](https://tabler-icons.io/)
|
|
20
|
+
- [Akar Icons](https://akaricons.com/)
|
|
21
|
+
- [Iconoir](https://iconoir.com/)
|
|
22
|
+
- [Cryptocurrency Icons](http://cryptoicons.co/)
|
|
23
|
+
|
|
24
|
+
Got suggestions for additional iconsets? Create an issue and we can consider adding them!
|
|
25
|
+
|
|
26
|
+
## Supported Versions
|
|
27
|
+
|
|
28
|
+
| Angular Version | Ng Icon Version |
|
|
29
|
+
| --------------- | ------------------ |
|
|
30
|
+
| 11.x.x | 12.x.x |
|
|
31
|
+
| 12.x.x | 13.x.x (or 12.x.x) |
|
|
32
|
+
| 13.x.x | 13.x.x or 14.x.x |
|
|
33
|
+
|
|
34
|
+
> Note: Ng Icons relies on modern browser features and is designed to work on evergreen browsers. We do not support older browsers such as IE11.
|
|
35
|
+
|
|
36
|
+
## Installation
|
|
37
|
+
|
|
38
|
+
You must install the `@ng-icons/core` package, however you only need to install the iconset libraries you intend to use.
|
|
39
|
+
|
|
40
|
+
E.g:
|
|
41
|
+
|
|
42
|
+
```bash
|
|
43
|
+
npm i @ng-icons/core @ng-icons/heroicons ...
|
|
44
|
+
```
|
|
45
|
+
|
|
46
|
+
or
|
|
47
|
+
|
|
48
|
+
```bash
|
|
49
|
+
yarn add @ng-icons/core @ng-icons/heroicons ...
|
|
50
|
+
```
|
|
51
|
+
|
|
52
|
+
## Packages
|
|
53
|
+
|
|
54
|
+
The following packages are available:
|
|
55
|
+
|
|
56
|
+
| Package | License |
|
|
57
|
+
| -------------------------------- | ---------- |
|
|
58
|
+
| `@ng-icons/core` | MIT |
|
|
59
|
+
| `@ng-icons/bootstrap-icons` | MIT |
|
|
60
|
+
| `@ng-icons/heroicons` | MIT |
|
|
61
|
+
| `@ng-icons/ionicons` | MIT |
|
|
62
|
+
| `@ng-icons/material-icons` | Apache 2.0 |
|
|
63
|
+
| `@ng-icons/css.gg` | MIT |
|
|
64
|
+
| `@ng-icons/feather-icons` | MIT |
|
|
65
|
+
| `@ng-icons/jam-icons` | MIT |
|
|
66
|
+
| `@ng-icons/octicons` | MIT |
|
|
67
|
+
| `@ng-icons/radix-icons` | MIT |
|
|
68
|
+
| `@ng-icons/tabler-icons` | MIT |
|
|
69
|
+
| `@ng-icons/akar-icons` | MIT |
|
|
70
|
+
| `@ng-icons/iconoir` | MIT |
|
|
71
|
+
| `@ng-icons/cryptocurrency-icons` | CC0-1.0 |
|
|
72
|
+
| `@ng-icons/simple-icons` | CC0-1.0 |
|
|
73
|
+
|
|
74
|
+
## Usage
|
|
75
|
+
|
|
76
|
+
Import the `NgIconsModule` and register the icons you wish to use:
|
|
77
|
+
|
|
78
|
+
```ts
|
|
79
|
+
import { NgIconsModule } from '@ng-icons/core';
|
|
80
|
+
import { FeatherAirplay } from '@ng-icons/feather-icons';
|
|
81
|
+
import { HeroUsers } from '@ng-icons/heroicons/outline';
|
|
82
|
+
|
|
83
|
+
@NgModule({
|
|
84
|
+
imports: [
|
|
85
|
+
BrowserModule,
|
|
86
|
+
NgIconsModule.withIcons({ FeatherAirplay, HeroUsers }),
|
|
87
|
+
],
|
|
88
|
+
})
|
|
89
|
+
export class AppModule {}
|
|
90
|
+
```
|
|
91
|
+
|
|
92
|
+
You can register icons in multiple modules, this allows icons to be lazy loaded in child modules.
|
|
93
|
+
|
|
94
|
+
You can then use the icon in your templates:
|
|
95
|
+
|
|
96
|
+
```html
|
|
97
|
+
<ng-icon name="feather-airplay"></ng-icon>
|
|
98
|
+
```
|
|
99
|
+
|
|
100
|
+
| Name | Type | Description |
|
|
101
|
+
| ----------- | -------------------- | ---------------------------------------------------------------------------------- |
|
|
102
|
+
| size | `string` | Define the size of the icon. This defaults to the current font size. |
|
|
103
|
+
| color | `string` | Define the color of the icon. This defaults to the current text color. |
|
|
104
|
+
| strokeWidth | `string` \| `number` | Define the stroke-width of the icon. This only works on iconsets that use strokes. |
|