openpencil/packages/docs/user-guide/pen-tool.md
Ilya Nikitin 0ff5a87ccb update pen tool space drag spec
Adds a new scenario to the pen tool specifications defining the behavior for relocating the active vertex with spacebar during a curve drag, including asserting that the cursor remains a crosshair instead of switching to the hand tool.

Made-with: Cursor
2026-03-27 21:27:45 +05:00

1.6 KiB

title description
Pen Tool Drawing vector paths with bezier curves using the pen tool in OpenPencil.

Pen Tool

The pen tool creates vector paths using a vector network data model, compatible with Figma's .fig format.

Activating

Press P to activate the pen tool.

Placing Points

  • Click to place a corner point (straight-line segment)
  • Click + drag to place a curve point with bezier tangent handles — the drag direction and length control the curve shape
    • Hold Space while dragging (without releasing the mouse button) to move the point itself

Click multiple points to build a path segment by segment. A preview line extends from the last placed point to your cursor as you move.

Closing a Path

Click on the first point of the path to close it into a loop. Closed paths can be filled.

Open Paths

Press Escape to commit the current path as an open path. Open paths render as strokes only — they're not filled.

Vector Networks

Paths in OpenPencil use vector networks — a more flexible model than simple point lists that supports branching paths and complex topology. This is the same model Figma uses, so paths round-trip perfectly in .fig files.

Keyboard Shortcuts

Action Mac Windows / Linux
Pen tool P P
Commit open path Escape Escape

Tips

  • The preview line always starts from the last placed point — it won't jump to (0,0).
  • Drag longer when placing a curve point to make the curve wider.
  • After creating a path, use the properties panel to adjust its fill, stroke, and effects.