Adding Lucid Icon in Angular with @lucid/angular

Step 1 : Install dependency bash

npm i @lucid/angular

Step 2: Register Icons In App Config (Optional)

...
import { LucidePlus, provideLucideIcons } from '@lucide/angular';

export const appConfig: ApplicationConfig = {
  providers: [
   ...,
    provideLucideIcons(
     LucidePlus,
    )
  ]
};

Step 3: Import Icon where you want to use

import { Component } from '@angular/core';
import { LucidePlus } from '@lucide/angular';

@Component({
  selector: 'app-search-dialog',
  imports: [LucidePlus],

  templateUrl: './search-dialog.html',
  styleUrl: './search-dialog.css',
})
export class SearchDialog {}

Step 4: use Icon in SVG tag

                <svg lucidePlus></svg>

Step 5: if not comming just restart the server ,

bye bye…..