GitHub - klarsys/angular-material-icons: AngularJS directive to use Material Design icons with custom fill-color and size. (original) (raw)

angular-material-icons

AngularJS directive to use Material Design icons with custom fill-color and size.

This project encompasses all SVG icons from Google's official Material Design Icon repository and few hand-picked icons from community-led MaterialDesignIcons.com in form of angular directive that gives option to specify custom fill-color and size.

Changes to icon will go through delightful morphing if SVG-Morpheus is also included in your application.

Installation

This library is available via bower and npm

• bower install angular-material-icons
• npm install angular-material-icons

Configure own icons

add many icons

angular.module('moduleName').config(function (ngMdIconServiceProvider) { ngMdIconServiceProvider.addShapes({ 'signal_wifi_0_bar': '', 'signal_wifi_1_bar': '', }); });

optionally You can add viewBox for icon if not want to do it in templates

• attribute view-box from template has higher priority so if given will override configured by service
• if not given viewBox in config and template will use default "0 0 24 24"

angular.module('moduleName').config(function (ngMdIconServiceProvider) { ngMdIconServiceProvider .addShape('evCross', '') .addViewBox('evCross', '0 0 612 612'); });

Demo

Checkout the live demo for usage instructions and a preview of all icons included in the set.

Licenses

This package is released under MIT license.

Icons are released under Attribution 4.0 International license.