setCurrentPageBackground

API reference for the setCurrentPageBackground method.

Updates the background of the user's current page. The background can be a solid color, an image or a video.

Usage

Set background color

import { setCurrentPageBackground } from "@canva/design";
import type { PageBackgroundFill } from "@canva/design";
const background: PageBackgroundFill = {
color: '#F5F5F5',
};
await setCurrentPageBackground(background);
TYPESCRIPT

Set background image

import { setCurrentPageBackground } from "@canva/design";
import type { PageBackgroundFill } from "@canva/design";
import type { ImageRef } from "@canva/asset";
const exampleImageRef = "YOUR_IMAGE_REF" as ImageRef;
const background: PageBackgroundFill = {
asset: {
type: 'image',
ref: exampleImageRef,
altText: { text: 'Background image', decorative: true }
},
};
await setCurrentPageBackground(background);
TYPESCRIPT

Set background video

import { setCurrentPageBackground } from "@canva/design";
import type { PageBackgroundFill } from "@canva/design";
import type { VideoRef } from "@canva/asset";
const exampleVideoRef = "YOUR_VIDEO_REF" as VideoRef;
const background: PageBackgroundFill = {
asset: {
type: 'video',
ref: exampleVideoRef,
altText: { text: 'Background video', decorative: true }
},
};
await setCurrentPageBackground(background);
TYPESCRIPT

Parameters

optsPageBackgroundFill
Required

The appearance of a page's background.

colorstring
Optional

The color of the fill as a hex code.

The hex code must include all six characters and be prefixed with a # symbol.

Example

"#ff0099"
TS
assetobject
Optional

An image or video to use as the fill.

An image asset that fills a path's interior.

typestring
Required

The type of fill.

This must be "image".

refImageRef
Required

A unique identifier that points to an image asset in Canva's backend.

altTextAltText
Optional

A description of the image content.

Use undefined for content with no description.

textstring
Required

The text content.

decorativeboolean | undefined
Required

Indicates where the alternative text should be displayed.

  • If true, the alternative text will only be displayed in the editor.
  • If false, the alternative text will be displayed in the editor and in view-only mode.

A video asset that fills a path's interior.

typestring
Required

The type of fill.

This must be "video".

refVideoRef
Required

A unique identifier that points to a video asset in Canva's backend.

altTextAltText
Optional

A description of the image content.

Use undefined for content with no description.

textstring
Required

The text content.

decorativeboolean | undefined
Required

Indicates where the alternative text should be displayed.

  • If true, the alternative text will only be displayed in the editor.
  • If false, the alternative text will be displayed in the editor and in view-only mode.

Returns

Promise<void>