TLNoteShape • tldraw Docs

A note shape representing a sticky note or text annotation on the canvas. Note shapes support rich text formatting, various styling options, and can be used for annotations, reminders, or general text content.

type TLNoteShape = TLBaseShape<"note", TLNoteShapeProps>;

Example

const noteShape: TLNoteShape = {
  id: "shape:note1",
  type: "note",
  x: 100,
  y: 100,
  rotation: 0,
  index: "a1",
  parentId: "page:main",
  isLocked: false,
  opacity: 1,
  props: {
    color: "light-blue",
    labelColor: "black",
    size: "s",
    font: "sans",
    fontSizeAdjustment: 2,
    align: "start",
    verticalAlign: "start",
    growY: 50,
    url: "https://example.com",
    richText: toRichText("Important **note**!"),
    scale: 1,
  },
  meta: {},
  typeName: "shape",
};