TLGeoShape • tldraw Docs

A geo shape represents geometric forms like rectangles, ellipses, triangles, and other predefined shapes. Geo shapes support styling, text content, and can act as containers.

type TLGeoShape = TLBaseShape<'geo', TLGeoShapeProps>

Example

const geoShape: TLGeoShape = {
  id: createShapeId(),
  typeName: 'shape',
  type: 'geo',
  x: 100,
  y: 100,
  rotation: 0,
  index: 'a1',
  parentId: 'page:page1',
  isLocked: false,
  opacity: 1,
  props: {
    geo: 'rectangle',
    w: 200,
    h: 100,
    color: 'black',
    fill: 'solid',
    dash: 'solid',
    size: 'm',
    font: 'draw',
    align: 'middle',
    verticalAlign: 'middle',
    richText: toRichText('Hello World'),
    labelColor: 'black',
    url: '',
    growY: 0,
    scale: 1,
  },
  meta: {},
}