AM MatIconModule

The AM MatIconModule is a set of icons for Angular Material that enables developers to quickly and easily add icons to their applications. This icon set is built on top of Google's Material Icons, which are designed to be simple, clear, and consistent across platforms.

Features

• Over 1200 icons to choose from
• All icons are vector-based and can be customized
• Easy to use with Angular Material components
• Consistent design language with Google's Material Design

Installation

To use the AM MatIconModule, simply install it via npm:

npm install @angular/material @angular/cdk @angular/animations @amcomponents/mat-icon-font

Usage

To use an icon in your application, simply add the <mat-icon> component to your template and specify the icon name as the component's content:

<mat-icon>menu</mat-icon>

You can also bind the icon name to a property in your component:

<mat-icon [svgIcon]="'menu'"></mat-icon>

Customization

The AM MatIconModule supports customization of icons through CSS styling. You can change the size, color, and other properties of an icon using CSS:

.mat-icon {
  color: red;
}

You can also define your own icons by adding them to the AM MatIconModule's icon registry:

import { MatIconRegistry } from '@angular/material/icon';
import { DomSanitizer } from '@angular/platform-browser';

constructor(private iconRegistry: MatIconRegistry, private sanitizer: DomSanitizer) {
  this.iconRegistry.addSvgIcon('my-icon', this.sanitizer.bypassSecurityTrustResourceUrl('path/to/my-icon.svg'));
}

Conclusion

The AM MatIconModule is a powerful and flexible icon set that makes it easy to add icons to your Angular Material applications. With over 1200 icons to choose from and robust customization options, it's a great choice for any developer who wants to create beautiful and consistent user interfaces.