Search code examples
ionic-frameworkionic2ionic-view

How add svg custom icon ionic 2

how to add custom icon ionic 2, i have svg file i need add the icon in menu 

this.pages = [
      {icon: 'Test', title: 'Logout', component: LoginPage }
    ];

    <ion-list>
      <button menuClose ion-item *ngFor="let p of pages" (click)="openPage(p)">
        <ion-icon name="{{p.icon}}" svgversion item-left></ion-icon>
        {{p.title}}
      </button>
    </ion-list>

layout.scss

ion-ion[name="test"][svgversion] {
  content: url("../../img/accountsDeposits.svg");
}
Solution

  • You can use fontastic to create svg icon fonts from your svg icons, you can use it online or export to your own svg fontface, it gives you instructions on how to use it, its FREE

    Follow link