penpot_add_shapes
Add shapes like rectangles, frames, text, circles, paths, boolean operations, or images to a page in a Penpot file.
Instructions
Add one or more shapes (rect, frame, text, circle, path, bool, image) to a page in a Penpot file. "circle" is an ellipse bounded by x/y/width/height (width === height for a true circle). "path" takes a "content" array of path commands ({ command: "move-to"|"line-to"|"curve-to"|"close-path", params: {x,y,...} }); its bounding box is derived automatically from the commands. "bool" is a boolean operation (boolType: "union"|"difference"|"intersection"|"exclusion") over its children — add the bool shape first (with an explicit "id"), then add children with "parentId" matching that id (same pattern as frames); Penpot's editor computes the visual result when the file is opened. "image" displays an uploaded media object — first call penpot_upload_media to get a mediaId, then provide mediaId/mediaWidth/mediaHeight (source pixel dimensions) along with x/y/width/height for the canvas placement. Colors accept either a literal hex string or a { token: "name" } reference resolved against the project token file; the same applies to numeric spacing/radius fields (layout gaps/padding, layoutItem margins/min/max sizes, corner radii r1-r4), resolved against the token file's "spacing"/"radii" tables, and to a shape's "shadows" array (each entry either an inline { style, color, opacity, offsetX, offsetY, blur, spread } object or a { token: "name" } reference into the token file's "shadows" table). Shapes may be rotated via the "rotation" field (degrees, clockwise, about the shape's center). Frames may declare flex or grid auto-layout via "layout"; any shape may set "layoutItem" to control its own placement within an auto-layout parent (sizing, alignment, margins, and, for grid parents, row/column).
Input Schema
| Name | Required | Description | Default |
|---|---|---|---|
| fileId | Yes | ||
| pageId | Yes | ||
| shapes | Yes | ||
| tokensPath | No | /app/tokens.json |