@tabler/icons 1.41.2 → 1.45.0

package/README.md

@@ -1,20 +1,34 @@
-# Tabler Icons
+<p align="center">
+  <img src="https://raw.githubusercontent.com/tabler/tabler-icons/master/.github/og.png" alt="Tabler Icons" width="838">
+</p>
 
-A set of over 1250 free MIT-licensed high-quality SVG icons for you to use in your web projects. Each icon is designed on a 24x24 grid and a `2px` stroke.
+<p align="center">
+    A set of over 1350 free MIT-licensed high-quality SVG icons for you to use in your web projects. Each icon is designed on a 24x24 grid and a 2px stroke.
+<p>
 
-**If you want to support my project and help me grow it, you can [become a sponsor on GitHub](https://github.com/sponsors/codecalm) or just [donate on PayPal](https://paypal.me/codecalm) :)**
+<p align="center">
+  <a href="https://tabler-icons.io/"><strong>Browse at tabler-icons.io &rarr;</strong></a>
+</p>
+
+<p align="center">
+    <a href="https://github.com/tabler/tabler-icons/releases"><img src="https://img.shields.io/npm/v/@tabler/icons" alt="Latest Release"></a>
+    <a href="https://github.com/tabler/tabler-icons/blob/master/LICENSE"><img src="https://img.shields.io/npm/l/@tabler/icons.svg" alt="License"></a>
+</p>
 
-Icons search: https://tabler-icons.io/
 
 ## Sponsors
 
+**If you want to support my project and help me grow it, you can [become a sponsor on GitHub](https://github.com/sponsors/codecalm) or just [donate on PayPal](https://paypal.me/codecalm) :)**
+
 <a href="https://github.com/sponsors/codecalm">
-    <img src='https://raw.githubusercontent.com/tabler/static/main/sponsors.png'>
-  </a>
+  <img src='https://raw.githubusercontent.com/tabler/static/main/sponsors.png'>
+</a>
 
 ## Preview
 
-![](https://raw.githubusercontent.com/tabler/tabler-icons/master/.github/icons.png)
+<p align="center">
+  <img src="https://raw.githubusercontent.com/tabler/tabler-icons/master/.github/icons.png" alt="Tabler Icons preview" width="838">
+</p>
 
 ## Sponsor Tabler
 
@@ -105,6 +119,71 @@ const MyComponent = () => {
 
 `@tabler/icons` exports it's own type declarations for usage with React and Typescript.
 
+### Angular
+
+Angular components available through [`angular-tabler-icons`](https://www.npmjs.com/package/angular-tabler-icons) package.  
+Install the package, then create icons module:
+
+```ts  
+import { NgModule } from '@angular/core';
+
+import { TablerIconsModule } from 'angular-tabler-icons';
+import { IconCamera, IconHeart, IconBrandGithub } from 'angular-tabler-icons/icons';
+
+// Select some icons (use an object, not an array)
+const icons = {
+  IconCamera,
+  IconHeart,
+  IconBrandGithub
+};
+
+@NgModule({
+  imports: [
+    TablerIconsModule.pick(icons)
+  ],
+  exports: [
+    TablerIconsModule
+  ]
+})
+export class IconsModule { }
+```
+
+After importing the _IconsModule_ in your feature or shared module, use the icons as follows:
+
+```html
+<i-tabler name="camera"></i-tabler>
+<i-tabler name="heart" style="color: red;"></i-tabler>
+<i-tabler name="brand-github" class="someclass"></i-tabler>
+```
+
+`angular-tabler-icons` exports it's own type declarations for usage with Typescript.
+
+For more usage documentation refer to [the official documentation](https://github.com/pierreavn/angular-tabler-icons).
+
+### Vue
+
+Vue components available through [`vue-tabler-icons`](https://www.npmjs.com/package/vue-tabler-icons) package.
+Install the package, import the icon component and render it in your component. You can adjust SVG properties by passing regular HTML attributes:
+
+```html
+<script>
+    // MyComponent.vue
+    import { BoldIcon } from 'vue-tabler-icons';
+
+    export default {
+        components: { BoldIcon },
+    };
+</script>
+
+<template>
+    <bold-icon />
+</template>
+```
+
+`vue-tabler-icons` exports it's own type declarations for usage with Typescript.
+
+For more usage documentation refer to [the official documentation](https://github.com/alex-oleshkevich/vue-tabler-icons).
+
 ### CDN
 
 All files included in `@tabler/icons` npm package are available over a CDN.
@@ -184,6 +263,10 @@ You can use [`tabler-icons-svelte`](https://github.com/benflap/tabler-icons-svel
 <CircleX />
 ```
 
+### Jetpack Compose
+
+For Android or Desktop you can use [`compose-icons`](https://github.com/DevSrSouza/compose-icons) to use icons in your projects. (see [docs](https://github.com/DevSrSouza/compose-icons/blob/master/tabler-icons/DOCUMENTATION.md))
+
 ## Multiple strokes
 
 All icons in this repository have been created with the value of the `stroke-width` property, so if you change the value, you can get different icon variants that will fit in well with your design.