You may have heard about the release of our new image editor. We put a lot of development into this feature and today we’re pleased to release some of the underlying source code to the public.

The Percolate image editor (codenamed “Predator”) allows Percolate users to manipulate images in the browser by applying custom text, graphics and filters. Predator consists of a client for previewing changes in the browser and a node.js service for editing full-resolution images in the background.

Carapace: Stepwise canvas manipulation for the browser and the server

Carapace is the JavaScript library that powers Predator’s canvas manipulation capabilities. It runs in the browser using the HTMLCanvasElement and in node.js using node-canvas. It features an extensible system for creating custom jobs and filters, and mechanisms for maintaing a history of changes and restoring canvas state.

Install Carapace via npm:

npm install carapace

Get the source and read the documentation at github.com/percolate/carapace.

Neue: A minimal async loader for web fonts

Neue lets you load fonts in a web page dynamically and invokes a callback when the fonts have been rendered. It has a super simple API and can be used with any font provider that serves CSS with @font-facedeclarations (e.g. Google Fonts, Typekit or roll your own).

Install Neue with npm:

npm install neue

Get the source and read the documentation at github.com/percolate/neue.

FVD: Font Variation Description for JavaScript

FVD is a handy little spec for unambiguously describing the @font-face properties of web fonts. Originally developed by Typekit and Google, it provides simple description of a web font, e.g. i7 corresponds tofont-style:italic;font-weight:700;. We liked the spec so we ported it to JavaScript.

Install FVD via npm:

$ npm install fvd

Get the source and read the documentation at github.com/percolate/fvd.