TLImageShape • tldraw Docs

An image shape representing a raster image on the canvas. Image shapes can display various image formats and support features like cropping, flipping, and asset management.

type TLImageShape = TLBaseShape<"image", TLImageShapeProps>;

Example

const imageShape: TLImageShape = {
  id: "shape:image1",
  type: "image",
  x: 100,
  y: 100,
  rotation: 0,
  index: "a1",
  parentId: "page:main",
  isLocked: false,
  opacity: 1,
  props: {
    w: 400,
    h: 300,
    playing: true,
    url: "",
    assetId: "asset:photo1",
    crop: null,
    flipX: false,
    flipY: false,
    altText: "Sample photo",
  },
  meta: {},
  typeName: "shape",
};