> ## Documentation Index
> Fetch the complete documentation index at: https://www.canva.dev/docs/apps/llms.txt
> Use this file to discover all available pages before exploring further.

# 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

```typescript
import { setCurrentPageBackground } from "@canva/design";
import type { PageBackgroundFill } from "@canva/design";

const background: PageBackgroundFill = {
  color: '#F5F5F5',
};

await setCurrentPageBackground(background);
```

### Set background image

```typescript
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);
```

### Set background video

```typescript
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);
```

## Parameters

<Prop.List>
  <Prop name="opts" required type="PageBackgroundFill" sourceLineNumbers={[6247]}>
    The appearance of a page's background.

    <PillAccordion defaultExpanded={true} title={<>Properties of <strong>opts</strong></>}>
      <Prop.List>
        <Prop name="color" type="string" sourceLineNumbers={[4119]}>
          The color of the fill as a hex code.

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

          <Prop.Extras>
            **Example**

            ```ts
            "#ff0099"
            ```
          </Prop.Extras>
        </Prop>

        <Prop name="asset" type="object" sourceLineNumbers={[4123]}>
          An image or video to use as the fill.

          <Tabs>
            <Tab name="Images">
              An image asset that fills a path's interior.

              <Prop.List>
                <Prop name="type" required type="string" sourceLineNumbers={[4512]}>
                  The type of fill.

                  The only valid value is `"image"`.
                </Prop>

                <Prop name="ref" required type="ImageRef" sourceLineNumbers={[4516]}>
                  A unique identifier that points to an image asset in Canva's backend.
                </Prop>

                <Prop name="altText" type="AltText" sourceLineNumbers={[4523]}>
                  A description of the image content.

                  Use `undefined` for content with no description.

                  <PillAccordion defaultExpanded={false} title={<>Properties of <strong>altText</strong></>}>
                    <Prop.List>
                      <Prop name="text" required type="string" sourceLineNumbers={[478]}>
                        The text content.
                      </Prop>

                      <Prop name="decorative" required type="boolean | undefined" sourceLineNumbers={[486]}>
                        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.
                      </Prop>
                    </Prop.List>
                  </PillAccordion>
                </Prop>
              </Prop.List>
            </Tab>

            <Tab name="Videos">
              A video asset that fills a path's interior.

              <Prop.List>
                <Prop name="type" required type="string" sourceLineNumbers={[6768]}>
                  The type of fill.

                  The only valid value is `"video"`.
                </Prop>

                <Prop name="ref" required type="VideoRef" sourceLineNumbers={[6772]}>
                  A unique identifier that points to a video asset in Canva's backend.
                </Prop>

                <Prop name="altText" type="AltText" sourceLineNumbers={[6779]}>
                  A description of the image content.

                  Use `undefined` for content with no description.

                  <PillAccordion defaultExpanded={false} title={<>Properties of <strong>altText</strong></>}>
                    <Prop.List>
                      <Prop name="text" required type="string" sourceLineNumbers={[478]}>
                        The text content.
                      </Prop>

                      <Prop name="decorative" required type="boolean | undefined" sourceLineNumbers={[486]}>
                        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.
                      </Prop>
                    </Prop.List>
                  </PillAccordion>
                </Prop>
              </Prop.List>
            </Tab>
          </Tabs>
        </Prop>
      </Prop.List>
    </PillAccordion>
  </Prop>
</Prop.List>

## Returns

`Promise<void>`

## Permissions

To use this method, the `canva:design:content:write` permission must be enabled for the app. To learn more, see [Permissions](https://www.canva.dev/docs/apps/configuring-intents-permissions/).