To add an embed element to the user's design, set the following parameters:
The type of element. For embed elements, this must be "EMBED"
.
The width of the element, in pixels.
If height
is a number, this can be set to "auto"
.
The height of the element, in pixels.
If width
is a number, this can be set to "auto"
.
The distance from the top edge of the container, in pixels.
The container could be a page, a group, or an app element.
The distance from the left edge of the container, in pixels.
The container could be a page, a group, or an app element.
The rotation of the element, in degrees. This must be a number between -180
and 180
.
This property doesn't have an effect unless you also set position properties for the element. To set a position, you must provide the width
, height
, top
, and left
properties.
To add a group element to the user's design, set the following parameters:
The type of element. For group elements, this must be "GROUP"
.
The elements to include in the group.
Each element must have the following properties:
The width of the element, in pixels.
If height
is a number, this can be set to "auto"
.
The height of the element, in pixels.
If width
is a number, this can be set to "auto"
.
The distance from the top edge of the page, in pixels.
The distance from the left edge of the page, in pixels.
The rotation of the element, in degrees. This must be a number between -180
and 180
.
This property doesn't have an effect unless you also set position properties for the element. To set a position, you must provide the width
, height
, top
, and left
properties.
To add an image element to the user's design, set the following parameters:
The type of element. For image elements, this must be "IMAGE"
.
A unique identifier that points to an image in Canva's backend.
The width of the element, in pixels.
If height
is a number, this can be set to "auto"
.
The height of the element, in pixels.
If width
is a number, this can be set to "auto"
.
The distance from the top edge of the container, in pixels.
The container could be a page, a group, or an app element.
The distance from the left edge of the container, in pixels.
The container could be a page, a group, or an app element.
The rotation of the element, in degrees. This must be a number between -180
and 180
.
This property doesn't have an effect unless you also set position properties for the element. To set a position, you must provide the width
, height
, top
, and left
properties.
To add a plaintext element to the user's design, set the following parameters:
The type of element. For plaintext elements, this must be "TEXT"
.
The text to add to the user's design, provided as an array of strings.
The size of the text, in pixels. This must be an integer between 1 and 1000 (inclusive). The default value is 16
.
In the user interface, the font size is displayed as points (pts), not pixels. This means the font size defined here will be different from what's shown to the user.
This property doesn't have an effect unless you also set position properties for the element. To set a position, you must provide the top
, left
, and width
properties.
The alignment of the text.
The available options include:
The default value is "start"
.
The color of the text as a hex code.
The hex code must include all six characters and be prefixed with a #
symbol — for example, "#ff0099"
.
The default value is "#000000"
.
A unique identifier that references a font in Canva's backend. To learn more, see Creating text .
The weight of the font.
The available options include:
"normal"
"thin"
"extralight"
"light"
"medium"
"semibold"
"bold"
"ultrabold"
"heavy"
The default value is "normal"
.
The style of the font.
The available options include:
The default value is "normal"
.
The decoration of the font.
The available options include:
The default value is "none"
.
The width of the element, in pixels.
The distance from the top edge of the container, in pixels.
The container could be a page, a group, or an app element.
The distance from the left edge of the container, in pixels.
The container could be a page, a group, or an app element.
The rotation of the element, in degrees. This must be a number between -180
and 180
.
This property doesn't have an effect unless you also set position properties for the element. To set a position, you must provide the top
, left
, and width
properties.
To add a richtext element to the user's design, set the following parameters:
The type of element. For richtext elements, this must be "RICHTEXT"
.
The width of the element, in pixels.
The distance from the top edge of the container, in pixels.
The container could be a page, a group, or an app element.
The distance from the left edge of the container, in pixels.
The container could be a page, a group, or an app element.
The rotation of the element, in degrees. This must be a number between -180
and 180
.
This property doesn't have an effect unless you also set position properties for the element. To set a position, you must provide the top
, left
, and width
properties.
To add a shape element to the user's design, set the following parameters:
The type of element. For shape elements, this must be "SHAPE"
.
The paths that define the shape of the element.
There must be between 1 and 30 paths. The maximum combined size of all paths must not exceed 2kb. The maximum number of unique fill colors across all paths is 6.
The shape of the path.
This accepts the same value as the d
attribute of the SVG <path>
element, with some limitations:
The path must start with an M
command
The path must not have more than one M
command
The path must not use the Q
command
The path must be closed, either with a Z
command at the end or by having the last coordinate match the first coordinate
The appearance of the path's interior.
If true
, users can drop images or videos onto the path to use them as a fill.
Although the dropTarget
property is optional, we encourage you to set it to prevent breaking in potential future API changes. For image fills dropTarget
can be false
, but for video fills it must be true
.
The color of the fill as a hex code.
The hex code must include all six characters and be prefixed with a #
symbol — for example, "#ff0099"
.
If set, a user can fill a shape with an asset.
The type of asset to fill the shape.
Valid values include:
The unique identifier of the paths[0].fill.asset.type
asset to fill the shape.
The weight of the stroke. This must be an integer between 0 and 100.
The color of the stroke as a hex code.
The hex code must include all six characters and be prefixed with a #
symbol — for example, "#ff0099"
.
The alignment of the stroke. The only supported value is "inset"
.
The scale and cropping of a shape. This is similar to the viewBox
attribute of a HTMLSVGElement
.
The width of the view box, in pixels.
The height of the view box, in pixels.
The distance of the shape from the top edge of the element, in pixels.
The distance of the shape from the left edge of the element, in pixels.
The width of the element, in pixels.
If height
is a number, this can be set to "auto"
.
The height of the element, in pixels.
If width
is a number, this can be set to "auto"
.
The distance from the top edge of the container, in pixels.
The container could be a page, a group, or an app element.
The distance from the left edge of the container, in pixels.
The container could be a page, a group, or an app element.
The rotation of the element, in degrees. This must be a number between -180
and 180
.
This property doesn't have an effect unless you also set position properties for the element. To set a position, you must provide the width
, height
, top
, and left
properties.
To add a table element to the user's design, set the following parameters:
The type of element. For table elements, this must be "TABLE"
.
The rows that make up a table. A table must have at least one row, one column, and no more than 225 cells.
An individual row within a table.
The cells that make up a row.
An individual cell within a row.
A text element to set as the contents of the cell.
The type of element. For text elements, this must be "TEXT"
.
The text to add to the user's design, provided as an array of strings.
The background of the cell.
The background color of the cell as a hex code. The hex code must include all six characters and be prefixed with a #
symbol — for example, "#ff0099"
.
The number of columns that the cell occupies.
The number of rows that the cell occupies.
To add a video element to the user's design, set the following parameters:
The type of element. For video elements, this must be "VIDEO"
.
A unique identifier that points to a video in Canva's backend.
The width of the element, in pixels.
If height
is a number, this can be set to "auto"
.
The height of the element, in pixels.
If width
is a number, this can be set to "auto"
.
The distance from the top edge of the page, in pixels.
The container could be a page or a group.
The distance from the left edge of the container, in pixels.
The container could be a page or a group.
The rotation of the element, in degrees. This must be a number between -180
and 180
.
This property doesn't have an effect unless you also set position properties for the element. To set a position, you must provide the width
, height
, top
, and left
properties.