Shapes

Add preset geometry shapes with fill and line styling.

Basic Shapes

slide.addShape('rect', { x: 1, y: 1, w: 3, h: 2, fill: '4472C4' });
slide.addShape('ellipse', { x: 5, y: 1, w: 3, h: 2, fill: 'ED7D31' });

Basic shapes output

Available Geometries

Common shapes: rect, ellipse, roundRect, diamond, triangle, heart, star5, rightArrow, leftArrow, upArrow, downArrow, hexagon, octagon, trapezoid, parallelogram, cloud, plus

The library supports 180+ preset geometries including stars, arrows, callouts, flowchart symbols, math operators, and more. See PresetGeometry for the full list.

Shape with Text

slide.addShape('roundRect', {
  x: 1, y: 1, w: 4, h: 2,
  fill: '0066CC',
  text: 'Click me',
  textRunOptions: { color: 'FFFFFF', bold: true, fontSize: 18 },
  textOptions: { verticalAlign: 'middle' },
});

Shape with text output

Shape with Hyperlink

slide.addShape('rect', {
  x: 1, y: 1, w: 3, h: 1.5,
  fill: '4472C4',
  text: 'Visit site',
  textRunOptions: { color: 'FFFFFF' },
  hyperlink: { url: 'https://example.com', tooltip: 'Open website' },
});

Line Styling

slide.addShape('rect', {
  x: 1, y: 1, w: 3, h: 2,
  fill: 'FFFFFF',
  line: { color: '003366', width: 2, dash: 'dash' },
});

Custom Geometry

Define shapes with path commands when presets aren't enough:

slide.addShape('rect', {
  x: 1, y: 1, w: 3, h: 3,
  customGeometry: {
    paths: [{
      w: 100, h: 100,
      commands: [
        { type: 'moveTo', x: 50, y: 0 },
        { type: 'lineTo', x: 100, y: 100 },
        { type: 'lineTo', x: 0, y: 100 },
        { type: 'close' },
      ],
    }],
  },
  fill: '70AD47',
});

Path commands: moveTo, lineTo, arcTo, cubicBezTo, close.

Adjust Values

Some preset geometries have adjustable parameters (e.g. corner radius on roundRect):

slide.addShape('roundRect', {
  x: 1, y: 1, w: 4, h: 2,
  fill: '4472C4',
  adjustValues: { adj: 30000 },
});

Options Reference

Option	Type	Description
x, y	number	Position in inches
w, h	number	Size in inches
fill	Fill	Fill color or gradient/pattern/picture
line	LineProperties	Border line
text	string	Text inside the shape
textRunOptions	TextRunOptions	Text formatting
textOptions	ShapeTextOptions	Text body settings (vertical align, wrap)
effects	EffectProperties	Shadow, glow, reflection, soft edge
hyperlink	HyperlinkProperties	Make shape a link
opacity	number	Shape opacity (0–100)
adjustValues	Record<string, number>	Geometry adjust handles
customGeometry	CustomGeometry	Custom path-based geometry
locks	ShapeLocks	Prevent move, resize, rotate, etc.

See ShapeOptions for the full reference.