Skip to main content

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.

Text in PenPrint works differently from text in a typical design tool. Instead of placing a font glyph that a printer fills with ink, PenPrint converts each character into an SVG stroke path. The pen plotter then traces those outlines — so your text looks hand-drawn rather than typeset. This distinction matters for how you think about sizing, spacing, and visual weight.

Adding a text object

Click the T button in the editor toolbar to add a new text object to the canvas. PenPrint places a default text element at position (50, 50) with the placeholder content “enter text hereeeeee”. The text is rendered immediately as a stroke path using the default line height of 20.
1

Click the T button

The new text object appears on the canvas at the default position. Fabric.js selects it automatically, so the Object Properties panel opens on the right.
2

Type your text

Find the textarea in the Object Properties panel. Clear the placeholder text and type your content. You can press Enter to start a new line — multi-line text is fully supported.
3

Apply your changes

When you finish editing, PenPrint calls updateText() internally, converts your content through the TextToSVG renderer, and updates the path on the canvas. The object resizes to fit the new text automatically.
The text object stores your raw string content in its data property. The visible canvas element is an SVG Path derived from that string — not editable text. Editing happens through the properties panel, not by clicking on the canvas element itself.

Editing text content

Select an existing text object on the canvas. The Object Properties panel shows a textarea containing the current text. Edit the content directly in that textarea. Changes are applied when you confirm the update, which re-renders the path via updateText(). updateText() calls TextToSVG(text, obj.lheight ?? 20), updates the Fabric.js path data, recalculates the object’s bounding dimensions with setDimensions(), refreshes its coordinates with setCoords(), and triggers a full canvas redraw with requestRenderAll().

Adjusting line spacing

The LINE SPACING input in the Object Properties panel controls the lheight property of the text object. This value determines how many canvas units of vertical space separate each line of text, and it also acts as the font size parameter passed to the TextToSVG renderer.
New text objects start with an lheight of 20. This produces legible output at typical print scales.
Enter a larger value in the LINE SPACING field to spread lines further apart and increase the visual size of each glyph. The text path is re-rendered immediately with the new value.
Enter a smaller value to tighten lines and reduce glyph size. Very small values may cause lines to overlap — check the canvas preview before exporting.
Because lheight drives both line separation and glyph scale, it is the primary way to control text size. Increase it to make text larger; decrease it to make text smaller.

How text renders as stroke paths

PenPrint uses TextToSVG to convert your string into an SVG path at the time you create or update the object. The resulting path has these default visual properties:
PropertyDefault value
fill"" (none)
stroke"black"
strokeWidth0.2
Because fill is empty and only stroke is set, the pen plotter traces the outline of each glyph rather than filling it in. This is intentional — the plotter draws lines, not filled shapes.
Do not expect text to look the same on-screen as it will in print. The thin stroke paths are rendered at 0.2 units wide, which is a fraction of a millimetre at 100mm scale. Very small text may appear faint on screen but print clearly with a fine-tipped pen.

Multi-line text

Press Enter in the textarea to add line breaks. PenPrint passes the full multi-line string to the TextToSVG renderer, which handles each line according to the lheight value. The resulting path spans multiple lines on the canvas.

Duplicating and deleting text objects

With a text object selected, the Object Properties panel provides two object-management actions:
  • Duplicate — clones the active text object, offsets the copy by 10 canvas units down and 10 units right, and adds it to the canvas. All properties including text content and line spacing are preserved in the clone.
  • Delete — removes the active text object from the canvas. This action cannot be undone.

Working with the canvas

Understand the coordinate space and how to move and scale objects.

Using icons and SVGs

Add vector icons or upload your own SVG artwork.

Preview, export, and share

Export your text design as GCODE for printing.

Build docs developers (and LLMs) love