Skip to content
png engine for spritesmith
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Failed to load latest commit information.

pngsmith Build status

This project has been deprecated in favor of pixelsmith, a spritesmith engine that additionally supports JPEG.

png engine for spritesmith.

This can be used for constructing a canvas, placing images on it, and extracting the result image.

Getting Started

Install the module with: npm install pngsmith

// Convert images into pngsmith objects
var images = ['img1.jpg', 'img2.png'];
pngsmith.createImages(this.images, function handleImages (err, imgs) {
  // Create a canvas to draw onto (200 pixels wide, 300 pixels tall)
  pngsmith.createCanvas(200, 200, function (err, canvas) {
    // Add each image at a specific location (upper left corner = {x, y})
    var coordinatesArr = [{x: 0, y: 0}, {x: 50, y: 50}];
    imgs.forEach(function (img, i) {
      var coordinates = coordinatesArr[i];
      canvas.addImage(img, coordinates.x, coordinates.y);
    }, canvas);

    // Export canvas to image
    canvas['export']({format: 'png'}, function (err, result) {
      result; // Binary string representing a PNG image of the canvas


This module was built to the specification for all spritesmith modules.


In lieu of a formal styleguide, take care to maintain the existing coding style. Add unit tests for any new or changed functionality. Lint using grunt and test via npm test.


Support this project and others by twolfson via gittip.

Support via Gittip


As of Dec 13 2013, Todd Wolfson has released this repository and its contents to the public domain.

It has been released under the UNLICENSE.

Something went wrong with that request. Please try again.