TLBookmarkShape • tldraw Docs

A bookmark shape represents a website link with optional preview content. Bookmark shapes display as cards showing the page title, description, and preview image.

type TLBookmarkShape = TLBaseShape<"bookmark", TLBookmarkShapeProps>;

Example

const bookmarkShape: TLBookmarkShape = {
  id: createShapeId(),
  typeName: "shape",
  type: "bookmark",
  x: 100,
  y: 100,
  rotation: 0,
  index: "a1",
  parentId: "page:page1",
  isLocked: false,
  opacity: 1,
  props: {
    w: 300,
    h: 320,
    assetId: "asset:bookmark123",
    url: "https://www.example.com",
  },
  meta: {},
};