Paper.js — The Swiss Army Knife of Vector Graphics Scripting.
Paper.js is an open source vector graphics scripting framework that runs on top of the HTML5 Canvas. It offers a clean Scene Graph / Document Object Model and a lot of powerful functionality to create and work with vector graphics and bezier curves, all neatly wrapped up in a well designed, consistent and clean programming interface.
Paper.js is based on and largely compatible with Scriptographer, a scripting environment for Adobe Illustrator with an active community of scripters and more than 10 years of development.
Paper.js is easy to learn for beginners and has lots to master for intermediate and advanced users.
- First of all, take a look at some of our examples.
- Download Paper.js or check out the latest version from our Github Repository.
- Want to learn Paper.js? Why not start now with one our Tutorials.
- If you have any questions or comments, please join the mailing list.
- To to stay up to date, follow us on Twitter.
Paper.js is not simply a wrapper around the Canvas, it offers much more:
- A Scene Graph / Document Object Model for vector graphics: Work with nested layers, groups, paths, compound paths, rasters, symbols etc.
- The handling and drawing of these graphic items is automatic and optimised, allowing you to construct or modify your items and styles and leave the drawing commands to Paper.js.
- A well designed and battle hardened Programming Interface.
- There is a good reason for the word Vector in Vector Graphics. Paper.js offers best of breed Vector Mathematics through its core types such as Point, Size and Rectangle.
- Simple, yet elaborate mouse and keyboard interaction.
- Construct paths and manipulate their curves and segments in very convenient ways.
- Inspect and manipulate the precise bounding box of any item, supporting complicated stroke styles with square ends and miter limits.
- Smoothen curves, simplify path segments by fitting curves through points.
- Simulate dashed strokes which are currently lacking from the Canvas object, at near native drawing speed.
Read our tutorials to learn more about the features of Paper.js.
Paper.js is aimed at modern browsers with support for the Canvas object and EcmaScript 5. Even though in theory it is possible to write code that works in older browsers (Yes Explorer 8 and below, we are looking at you!), we currently do not support them out of the box. Let’s go forward!