Ionic2 - Custom Icons from css

We use this MaterialDesign Icons in our desktop app, is there a way to include them in “<ion-icon name” ?

I’m not sure if this is possible, but I would like to use them in ionic2 and also on the ionic-icon component


I m also trying to use the Google material design icons. Have you come up with a solution.
I ran npm install material-deisgn-icons and now have the node_module.

I included:

gulp.task('sass', function(){ return buildSass({ sassOptions: { includePaths: [ 'node_modules/ionic-angular', 'node_modules/ionicons/dist/scss', 'node_modules/material-design-icons/iconfont/*.+css' ] } }); }); gulp.task('html', copyHTML); gulp.task('fonts', function(){ return copyFonts({ src: [ 'node_modules/ionic-angular/fonts/**/*.+(ttf|woff|woff2)', 'node_modules/material-design-icons/iconfont/*.+(ttf|woff|woff2|svg|ijmap|eot)' ] }); });

I receive an error of app/theme/ Error: File to import not found or unreadable: material-design-icons @import "material-design-icons";

Just wondering what I should import in the scss file?

Hello @andrewg8, no I didn’t find a solution for now,
my hope was to find a solution with the community but it seems now one does it need.

If you find a solution please let me know.

See my answer here.

1 Like