Advanced Plumin.js example, using binary path operations, try it at http://jsfiddle.net/gh/gist/library/pure/d05d597a69e6569a3875/

fiddle.css

textarea {
	width: 100%;
	height: 300px;
	
	margin: 0;
	padding: 20px;
	
	border: 0;
	border-radius: 0;
	
	font-family: 'Demo', sans-serif;
	font-size: 50px;
	
	resize: none;
}
 
#download {
	display: inline-block;
	margin: 5px;
	padding: 5px 7px;
	
	text-decoration: none;
	color: #FFE;
	background: #FF725E;
}

fiddle.html

<textarea>A B C</textarea>
<a download="demo.otf" href="#" id="download">▽ Download</a>
<canvas id="canvas" width="1024" height="1024" style="display: none;"></canvas>

fiddle.js

(function(p) {
'use strict';

// Setup paper.js by providing a canvas element
p.setup( document.getElementById('canvas') );

var font = new p.Font({
		familyName: 'Demo',
		ascender: 800,
		descender: -200
	}),

	// glyphs
	A = new p.Glyph({
		name: 'A',
		unicode: 'A',
		advanceWidth: 512
	}),
	B = new p.Glyph({
		name: 'B',
		unicode: 'B',
		advanceWidth: 512
	}),
	C = new p.Glyph({
		name: 'C',
		unicode: 'C',
		advanceWidth: 512
	}),
	shape,
	counter;

// A contours
shape = new p.Path.RegularPolygon({
	center: [256, 136],
	sides: 3,
	radius: 256
});
counter = new p.Path.RegularPolygon({
	center: [256, 61],
	sides: 3,
	radius: 256
});
shape.rotate(180, [256, 136]);
counter.rotate(180, [256, 61]);
A.addContour(shape.subtract(counter));
A.scale(1,2, [256, 0]);

// B contours
shape = new p.Path.Rectangle({
	point: [0, 0],
	size: [450, 450]
});
counter = new p.Path.Rectangle({
	point: [40, 40],
	size: [370, 370]
});
B.addContour(shape.subtract(counter));
shape = new p.Path.Rectangle({
	point: [0, 410],
	size: [340, 340]
});
counter = new p.Path.Rectangle({
	point: [40, 450],
	size: [260, 260]
});
B.addContour(shape.subtract(counter));

// C contours
shape = new p.Path.Ellipse({
	point: [0, 0],
	size: [520, 800]
});
counter = new p.Path.Ellipse({
	point: [40, 40],
	size: [440, 720]
});
shape = shape.subtract(counter);
counter = new p.Path.Rectangle({
	point: [430, 180],
	size: [100, 440]
});
C.addContour(shape.subtract(counter));

font.addGlyphs([ A, B, C ]);
font.updateOTCommands()
	.addToFonts();
 
document.getElementById('download').onclick = function() {
    font.download();
};

})(plumin.paper);
				

fiddle.manifest

name: Advanced Plumin.js example
description: Using binary operations to create hollow geometric letters
authors:
  - Louis-Rémi Babé
resources:
  - http://byte-foundry.github.io/plumin.js/dist/plumin.js
  - http://byte-foundry.github.io/plumin.js/bower_components/knacss/css/knacss.css
normalize_css: no
wrap: b