Once your design is ready, PenPrint offers three actions at the bottom of the editor: Preview image, Download GCODE, and Send to me!. Each one takes your canvas, converts it to an SVG representation, and does something different with the result. Understanding what each action does helps you choose the right one at the right time.Documentation Index
Fetch the complete documentation index at: https://mintlify.com/howtodo1/printer-web/llms.txt
Use this file to discover all available pages before exploring further.
Preview image
The Preview image button renders a real-time preview of what your design will look like as pen strokes, without sending anything anywhere.Click Preview image
PenPrint calls
canvas.toSVG({ width: "100", height: "100" }) to produce an SVG string from the current canvas state, with explicit 100×100 output dimensions representing the 100mm×100mm print area.WASM flattening
The SVG is passed to a WebAssembly module that runs
flatten(svg, 100, 100, 0.1). This converts all strokes into a normalised, plottable path representation — the same transformation that would be applied before sending to a physical pen plotter.The preview is generated entirely in the browser using WebAssembly. No data leaves your machine during a preview.
Download GCODE
The Download GCODE button performs the same SVG-to-GCODE pipeline as the preview, then triggers a file download so you can feed the output directly to your pen plotter.Click Download GCODE
PenPrint runs the same
canvas.toSVG and WASM flatten pipeline used by the preview, producing a GCODE string.Header is prepended
PenPrint prepends a standard plotter header to the GCODE output:The
G21 command sets units to millimetres. G90 enables absolute positioning. G28 X Y homes the X and Y axes.Placeholders are substituted
Three tokens in the GCODE are replaced with machine-specific values before the file is written:
{UP}— the pen-up command (lifts the pen off the paper).{DOWN}— the pen-down command (lowers the pen onto the paper).{SPEED}— the feed rate, expressed in millimetres per minute (speed × 60, formatted as anFvalue in GCODE).
How Download GCODE differs from Preview image
How Download GCODE differs from Preview image
Both actions run the identical SVG-to-WASM pipeline. The difference is the output destination: Preview image displays the result in the browser canvas, while Download GCODE writes the plotter instructions to a file and triggers a download. The GCODE file also includes the machine header and placeholder substitutions that the preview does not need.
GCODE header reference
GCODE header reference
| Line | Meaning |
|---|---|
G21 | Set units to millimetres |
G90 | Absolute positioning mode |
{UP} | Pen-up command (machine-specific) |
G28 X Y | Home X and Y axes |
Send to me!
The Send to me! button uploads your design to the PenPrint maintainer so they can print it on a physical pen plotter and send you the result.Design something worth printing
Compose your artwork on the canvas. The send action is intended for finished designs you want printed on paper.
Click Send to me!
PenPrint generates the SVG from the canvas and uploads it to a Supabase table called
svgs. The upload only proceeds if the SVG string is longer than 800 characters — very simple or empty canvases are not sent.The Send to me! button is a one-time action. If you want to submit a revised version of your design, reload the page and send again.
Sharing via URL
In addition to the three action buttons, you can share any design as a URL. Encode your canvas SVG as Base64 and append it to the PenPrint URL using the?svgB64= query parameter. Anyone who opens the link will have the design pre-loaded on their canvas, ready to preview or export.
See the canvas documentation for full details on how URL sharing works and its limitations.
Related pages
Working with the canvas
Understand the coordinate space and how to share designs via URL.
Adding and editing text
Create text objects that render as pen-plotter stroke paths.
Using icons and SVGs
Add icons from the built-in library or upload your own SVG.