Feature request: Custom svg icons

Describe the problem you’d like to see solved or task you’d like to see made easier

Allow users to add custom SVG icons to the font awesome.

Is this in relation to an existing part of angular-fontawesome or something new?

I think it’s a new feature because I didn’t find this feature angular-fontawesome.

What is 1 thing that we can do when building this feature that will guarantee that it is awesome?

Add custom SVG icons.

Why would other angular-fontawesome users care about this?

Because everyone eventually will have to add custom icons to their projects.

On a scale of 1 (sometime in the future) to 10 (absolutely right now), how soon would you recommend we make this feature?

10, I think it’s pretty easy to implement this functionality. We just need to allow to add custom icons to the library in the same way we add the font awesome ones.

Feature request checklist

• [*] This is a single feature (i.e. not a re-write of all of Font Awesome)
• [*] The title starts with "Feature request: " and is followed by a clear feature name (Ex: Feature request: moar cowbell)
• [*] I have searched for existing issues and to the best of my knowledge this is not a duplicate

[devoto13]

@jkon Find below an example of one of our custom icons:

export const applicationIcon: IconDefinition = {
  prefix: 'xxx',
  iconName: 'yyy',
  icon: [ 
    512, // SVG view box width
    512, // SVG view box height
    [], 
    'U+E002', // probably not important for SVG and JS approach
    `M0,285.8h226.2V3H0V285.8z M0,512h226.2V342.3H0V512z M282.8,512H509V229.2H282.8V512z M282.8,3v169.7H509V3H282.8z`,
  ],
} as any;

And then you pass this object into fa-icon component:

<fa-icon [icon]="applicationIcon"></fa-icon>

Note that you can have only one path in your icon. Also there were some other requirements in regards of path being closed (but can’t remember precisely now). I would recommend to take one of the existing icons and modify it instead of starting from scratch. This way it will be easier to see what works or not.

[jkon]

@devoto13 Thanks, that worked! I think my problem was not defining the object as an IconDefinition or maybe not casting as any.