acy-fontawesome

A lightweight icon package for Angular 21 with a Font Awesome style API.

Features

• Standalone Angular component: afi-icon
• Global icon registration via provideAfiIcons(...)
• String based icon usage: icon="user"
• Supports size, spin and fixed width classes

Install

npm install acy-fontawesome

Quick Start

Register icons at bootstrap:

import { bootstrapApplication } from '@angular/platform-browser';
import { AppComponent } from './app/app.component';
import { AFI_BASIC_ICONS, provideAfiIcons } from 'acy-fontawesome';

bootstrapApplication(AppComponent, {
  providers: [provideAfiIcons(...AFI_BASIC_ICONS)],
});

Use in a standalone component:

import { Component } from '@angular/core';
import { AfiIconComponent } from 'acy-fontawesome';

@Component({
  selector: 'app-root',
  standalone: true,
  imports: [AfiIconComponent],
  template: `
    <afi-icon icon="user"></afi-icon>
    <afi-icon icon="check" size="2x"></afi-icon>
    <afi-icon icon="spinner" [spin]="true"></afi-icon>
  `,
})
export class AppComponent {}

Define Your Own Icons

import { AfiIconDefinition } from 'acy-fontawesome';

export const myRocket: AfiIconDefinition = {
  name: 'rocket',
  svg: '<svg viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg"><path d="..."/></svg>',
};

Then register:

provideAfiIcons(myRocket)

Build Library

npm install
npm run build

Publish To npm

npm login
npm run build
cd dist/acy-fontawesome
npm publish --access public