getDefaultPageDimensions

API reference for the getDefaultPageDimensions method.

This version of the API is a preview. Preview APIs are unstable and may change without warning. You can't release public apps using this API until it's stable.

This API is deprecated, and is no longer recommended for use, and should be removed from your app.

Gets the default dimensions that a new page will have when it is added to a design. It is possible for a user to resize a page without resizing the entire design, e.g. by clicking "Expand to Whiteboard". However, there will always be a single set of default dimensions for a design that is applied whenever a new page is created.

Returns undefined if the design is unbounded (e.g. Whiteboard or Doc).

Usage

Get default page dimensions

import { getDefaultPageDimensions } from "@canva/design";

const dimensions = await getDefaultPageDimensions();

if (dimensions) {
  // Do something with the dimensions, e.g. `dimensions.width` and `dimensions.height`
} else {
  // This design type does not have fixed dimensions, e.g. Whiteboard or Doc
}

TYPESCRIPT

Center element using page dimensions

import { getDefaultPageDimensions, addElementAtPoint } from "@canva/design";
import type { ImageElementAtPoint } from "@canva/design";

const dimensions = await getDefaultPageDimensions();

if (dimensions) {
  const elementWidth = 300;
  const elementHeight = 200;

  const element: ImageElementAtPoint = {
    type: 'image',
    dataUrl: 'data:image/png;base64,...',
    altText: { text: 'Centered image', decorative: false },
    top: (dimensions.height - elementHeight) / 2,
    left: (dimensions.width - elementWidth) / 2,
    width: elementWidth,
    height: elementHeight
  };

  await addElementAtPoint(element);
}

TYPESCRIPT

Returns

A Promise that resolves with either undefined or the following object:

widthnumber

A width, in pixels.

heightnumber

A height, in pixels.