Skip to content
Go to file


Build Status npm version

Inky is an HTML-based templating language that converts simple HTML into complex, responsive email-ready HTML. Designed for Foundation for Emails.

Give Inky simple HTML like this:

  <columns large="6"></columns>
  <columns large="6"></columns>

And get complicated, but battle-tested, email-ready HTML like this:

<table class="row">
      <th class="small-12 large-6 columns first">
            <th class="expander"></th>
      <th class="small-12 large-6 columns first">
            <th class="expander"></th>


npm install inky --save-dev


Inky can be used standalone, as a Gulp plugin, or with a CLI. You can also access the Inky parser class directly.


var inky = require('inky');

  src: 'src/pages/**/*.html',
  dest: 'dist'
}, function() {
  console.log('Done parsing.');

With Gulp

var inky = require('inky')

function parse() {

Command Line

Install foundation-cli to get the foundation command.

Plugin Settings

  • src (String): Glob of files to process. You don't need to supply this when using Inky with Gulp.
  • dest (String): Folder to output processed files to. You don't need to supply this when using Inky with Gulp.
  • components (Object): Tag names for custom components. See custom components below to learn more.
  • columnCount (Number): Column count for the grid. Make sure your Foundation for Emails project has the same column count in the Sass as well.
  • cheerio (Object): cheerio settings (for available options please refer to cheerio project at github).

Custom Components

Inky simplifies the process of creating HTML emails by expanding out simple tags like <row> and <column> into full table syntax. The names of the tags can be changed with the components setting.

Here are the names of the defaults:

  button: 'button',
  row: 'row',
  columns: 'columns',
  container: 'container',
  inky: 'inky',
  blockGrid: 'block-grid',
  menu: 'menu',
  menuItem: 'item'

Programmatic Use

The Inky parser can be accessed directly for programmatic use. It takes in a Cheerio object of HTML, and gives you back a converted Cheerio object.

var Inky = require('inky').Inky;
var cheerio = require('cheerio');

var options = {};
var input = '<row></row>';

// The same plugin settings are passed in the constructor
var i = new Inky(options);
var html = cheerio.load(input)

// Now unleash the fury
var convertedHtml = i.releaseTheKraken(html);

// The return value is a Cheerio object. Get the string value with .html()
You can’t perform that action at this time.