gulp-iconfont Configuration

_icons.css

/* Icon CSS Template - Used by gulp-iconfont plugin to create CSS file to use with fonts */

@font-face {
  font-family: "<%= fontName %>";
  src: url('<%= fontPath %><%= fontName %>.eot');
  src: url('<%= fontPath %><%= fontName %>.eot?#iefix') format('eot'),
    url('<%= fontPath %><%= fontName %>.woff') format('woff'),
    url('<%= fontPath %><%= fontName %>.ttf') format('truetype'),
    url('<%= fontPath %><%= fontName %>.svg#<%= fontName %>') format('svg');
  font-weight: normal;
  font-style: normal;
}

.<%= className %>:before {
  display: inline-block;
  font-family: "<%= fontName %>";
  font-style: normal;
  font-weight: normal;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.<%= className %>-lg {
  font-size: 1.3333333333333333em;
  line-height: 0.75em;
  vertical-align: -15%;
}
.<%= className %>-2x { font-size: 2em; }
.<%= className %>-3x { font-size: 3em; }
.<%= className %>-4x { font-size: 4em; }
.<%= className %>-5x { font-size: 5em; }
.<%= className %>-fw {
  width: 1.2857142857142858em;
  text-align: center;
}

<% _.each(glyphs, function(glyph) { %>.<%= className %>-<%= glyph.name %>:before { content: "\<%= glyph.unicode[0].charCodeAt(0).toString(16).toUpperCase() %>" }
<% }); %>

gulpfile.js

var gulp = require('gulp');
var iconfont = require('gulp-iconfont');
var debug = require('gulp-debug');
var consolidate = require('gulp-consolidate');
	_ = require('lodash');

var runTimestamp = Math.round(Date.now()/1000);
var myFont = 'my-icons';

gulp.task('build-font', function() {
	
	gulp.src(['assets/icons/*.svg'])
	.pipe(iconfont({
		fontName: myFont, //required
		appendUnicode: true, //recommended option
		formats: ['ttf', 'eot', 'woff', 'svg'], // 'woff2' is also available
		fontHeight: 600, //creating the icons larger allows for better rendering at sizes greater than 100px
		normalize: true
	}))
	
	.on('glyphs', function(glyphs, options) {
		// CSS templating, e.g.
		// Place CSS from below in this file.  This template will then be used to create custom CSS based upon font objects.
		
		gulp.src('css/templates/_icons.css')
		.pipe(consolidate('lodash', {
			glyphs: glyphs,
			fontName: myFont,
			fontPath: '../fonts/',
			className: 'icon'
		}))
		.pipe(gulp.dest('www/css/'));			
	})
	
	.pipe(gulp.dest('www/fonts/'));
	
});

gulp.task('buildStyles', function() {

	return gulp.src('www/css/_icons.less')
		.pipe(less({
			paths: [ path.join(__dirname, 'less', 'includes') ]
		}))
		.pipe(gulp.dest('www/css/'));
});