Your browser does not support HTML5 canvas. Your browser does not support HTML5 canvas.

Click to Restart

Commands you can enter:

Simple commands

rect[x,y,width,height] creates a rectangle at (x,y) with specified width and height.
circle[x,y,radius] creates a circle at (x,y) of specified radius.

line[x1,y1,x2,y2] creates a line between two points.
curve[x1,y1,x2,y2,x3,y3] creates a Bezier curve between the first point and the last point. Curve approaches but does not go through middle point.
curve[x1,y1,x2,y2,x3,y3,x4,y4] creates a Bezier curve between the first point and the last point. Curve approaches but does not go through middle two points.

path[(x,y),(x,y),<x,y>,(x,y),<x,y>,<x,y>,(x,y), ... ] creates a path that goes through the points surrounded by parentheses and curves toward control points in triangle brackets. Paths must have at least 2 points, and points can have up to two control points between adjacent points. To fill a path, the path must be oriented counterclockwise and end at its starting point.
text["string", x,y, size, "fontname""] writes the string at the specified point at the specified size. Avaliable fonts can be found below. Quotes can be escaped by writing \", which will be replaced with a proper quote mark. Backslashes can be escaped with \\.

Manipulations and grouping

complex{ ... } joins a set of paths or shapes into a single object. Paths in a single object cannot intersect each other, and if one path is inside another, the inner one must be reversed so that it forms a hole.
~cmd or reverse{ ... } reverses the specified command. This turns a normal (counterclockwise) shape into a (clockwise) hole. Should only appear within a complex wrapper.

Transformations

translate[dx,dy]{ ... } shifts the enclosed commands by the specified amounts.
rotate[angle]{ ... } rotates the enclosed commands around the origin by the specified degree measure.
rotate[angle, x,y]{ ... } rotates the enclosed commands around the specified point by the specified degree measure.
scale[factor]{ ... } scales the enclosed commands by the given scale factor (less than one means shrink, greater means enlarge)

constrain[x,y,w,h]{ ... } constrains the enclosed commands to lie within the given rectangle. It will translate or scale them if necessary, but will have no effect if they are entirely enclosed in the rectangle.

Available fonts: