Icon

Demo

Code

angular.json or project.json:

  
    
      
        {
        
    
      
          "architect": {
        
    
      
            "build": {
        
    
      
              "builderOrExecutor": "@angular-devkit/build-angular:application",
        
    
      
              "options": {
        
    
      
                "loader": {
        
    
      
                  ".svg": "text"
        
    
      
                }
        
    
      
              }
        
    
      
            }
        
    
      
          }
        
    
      
        }

Component:

  
    
      
        constructor(private sanitizer: DomSanitizer) {
        
    
      
          import('bootstrap-icons/icons/bootstrap.svg').then((icon) => {
        
    
      
            this.icon = sanitizer.bypassSecurityTrustHtml(icon.default);
        
    
      
          });
        
    
      
        }
        
    
      
        
        
    
      
        icon?: SafeHtml;

HTML:

  
    
      
        <span [innerHTML]="icon"></span>

src/types.d.ts:

  
    
      
        declare module "*.svg" {
        
    
      
          const content: string;
        
    
      
          export default content;
        
    
      
        }

This requires the @angular-devkit/build-angular:application builder

All icons

A list of all icons is available here.