ByteChef LogoByteChef

Canva

Canva is a web and mobile application designed to help users create, design, and collaborate on visual content.

Categories: Productivity and Collaboration

Type: canva/v1


Connections

Version: 1

OAuth2 Authorization Code

Properties

NameLabelTypeDescriptionRequired
clientIdClient idSTRINGtrue
clientSecretClient secretSTRINGtrue

Connection Setup

Find Client ID and Secret

  1. Navigate to Canva Developers page.
  2. Click on Create an integration.
  3. Choose type of the integration and click on Create Integration.
  4. Click on Scopes.
  5. Select following scopes:
    • asset:read
    • asset:write
    • design:content:read
    • design:content:write
    • design:meta:read
  6. Click on Authentication.
  7. Enter a redirect URI, e.g., https://app.bytechef.io/callback, http://127.0.0.1:5173/callback.
  8. Click on Configuration.
  9. Click on Generate secret.
  10. Copy Client ID and Secret.
  11. Save changes.

Actions

Create Design

Name: createDesign

Create a Canva design.

Properties

NameLabelTypeDescriptionRequired
typeTypeSTRING
Options preset, custom
true
nameNameSTRING
Options doc, email, presentation, whiteboard
The name of the design type.true
widthWidthINTEGERThe width of the design, in pixels.true
heightHeightINTEGERThe height of the design, in pixels.true
titleTitleSTRINGThe name of the design.false
asset_idAsset IdSTRINGThe ID of an asset to insert into the created design.false

Example JSON Structure

{
  "label" : "Create Design",
  "name" : "createDesign",
  "parameters" : {
    "type" : "",
    "name" : "",
    "width" : 1,
    "height" : 1,
    "title" : "",
    "asset_id" : ""
  },
  "type" : "canva/v1/createDesign"
}

Output

Type: OBJECT

Properties

NameTypeDescription
idSTRINGThe design ID.
ownerOBJECT
Properties {STRING(user_id), STRING(team_id)}
URLsARRAY
Items [STRING(edit_url), STRING\(view_url)]
created_atDATE_TIMEWhen the design was created in Canva.
updated_atDATE_TIMEWhen the design was last updated in Canva.
titleSTRINGThe design title.
thumbnailOBJECT
Properties {INTEGER(width), INTEGER(height), STRING(url)}
A thumbnail image representing the object.
page_countINTEGERThe total number of pages in the design.

Output Example

{
  "id" : "",
  "owner" : {
    "user_id" : "",
    "team_id" : ""
  },
  "URLs" : [ "", "" ],
  "created_at" : "2021-01-01T00:00:00",
  "updated_at" : "2021-01-01T00:00:00",
  "title" : "",
  "thumbnail" : {
    "width" : 1,
    "height" : 1,
    "url" : ""
  },
  "page_count" : 1
}

Find Asset ID

To find the Asset ID, click here.

Export Design

Name: exportDesign

Get the status and results of an export job, including link(s) to the downloadable file(s).

Properties

NameLabelTypeDescriptionRequired
design_idDesign IDSTRINGThe design ID.true
typeTypeSTRING
Options pdf, jpg, png, pptx, gif, mp4, html_bundle, html_standalone
true
qualityQualityINTEGERThe quality of the exported JPEG that determines how compressed the exported file should be.true
video_qualityVideo qualitySTRING
Options horizontal_480p, horizontal_720p, horizontal_1080p, horizontal_4k, vertical_480p, vertical_720p, vertical_1080p, vertical_4k
The orientation and resolution of the exported video.true
export_qualityExport qualitySTRING
Options regular, pro
Specifies the export quality of the design.false
widthWidthINTEGERSpecify the width in pixels of the exported image.false
heightHeightINTEGERSpecify the height in pixels of the exported image.false
sizeSizeSTRING
Options a4, a3, letter, legal
The paper size of the export PDF file.false
losslessLosslessBOOLEAN
Options true, false
If set to true (default), the PNG is exported without compression.false
transparent_backgroundTransparent backgroundBOOLEAN
Options true, false
If set to true, the PNG is exported with a transparent background.false
as_single_imageAs single imageBOOLEAN
Options true, false
When true, multi-page designs are merged into a single image.false
pagesPagesARRAY
Items [INTEGER]
To specify which pages to export in a multi-page design.false

Example JSON Structure

{
  "label" : "Export Design",
  "name" : "exportDesign",
  "parameters" : {
    "design_id" : "",
    "type" : "",
    "quality" : 1,
    "video_quality" : "",
    "export_quality" : "",
    "width" : 1,
    "height" : 1,
    "size" : "",
    "lossless" : false,
    "transparent_background" : false,
    "as_single_image" : false,
    "pages" : [ 1 ]
  },
  "type" : "canva/v1/exportDesign"
}

Output

Type: OBJECT

Properties

NameTypeDescription
idSTRINGThe export job ID.
statusSTRINGThe export status of the job.
URLsARRAY
Items [STRING]
Download URL(s) for the completed export job.

Output Example

{
  "id" : "",
  "status" : "",
  "URLs" : [ "" ]
}

Find Design ID

To find the Design ID, click here.

Upload Asset

Name: uploadAsset

Get the status and results of an upload asset job.

Properties

NameLabelTypeDescriptionRequired
asset_nameAsset nameSTRINGThe asset's name.true
assetAssetFILE_ENTRYAsset to upload.true

Example JSON Structure

{
  "label" : "Upload Asset",
  "name" : "uploadAsset",
  "parameters" : {
    "asset_name" : "",
    "asset" : {
      "extension" : "",
      "mimeType" : "",
      "name" : "",
      "url" : ""
    }
  },
  "type" : "canva/v1/uploadAsset"
}

Output

Type: OBJECT

Properties

NameTypeDescription
jobOBJECT
Properties {STRING(id), STRING(status), {STRING(id), STRING(type), STRING(name), [STRING](tags), {STRING(user_id), STRING(team_id)}(owner), STRING(created_at), STRING(updated_at), {STRING(width), STRING(height), STRING(url)}(thumbnail)}(asset)}

Output Example

{
  "job" : {
    "id" : "",
    "status" : "",
    "asset" : {
      "id" : "",
      "type" : "",
      "name" : "",
      "tags" : [ "" ],
      "owner" : {
        "user_id" : "",
        "team_id" : ""
      },
      "created_at" : "",
      "updated_at" : "",
      "thumbnail" : {
        "width" : "",
        "height" : "",
        "url" : ""
      }
    }
  }
}

What to do if your action is not listed here?

If this component doesn't have the action you need, you can use Custom Action to create your own. Custom Actions empower you to define HTTP requests tailored to your specific requirements, allowing for greater flexibility in integrating with external services or APIs.

To create a Custom Action, simply specify the desired HTTP method, path, and any necessary parameters. This way, you can extend the functionality of your component beyond the predefined actions, ensuring that you can meet all your integration needs effectively.


Additional Instructions

How to Find Your Canva Design ID

  1. Open your design in Canva.

  2. Look at the URL in your browser. It will look similar to:

    https://www.canva.com/design/DAF123abcXYZ/edit

    The Design ID is a part after /design/ of the URL (DAF123abcXYZ in this example).

How to Find Your Canva Asset ID

  1. Navigate to the asset you uploaded (e.g., image, video, or file) from Projects, Uploads, or within a design in Canva.

  2. Click on the asset to open its preview or use it inside a design.

  3. Look at the URL in your browser. It will look similar to:

    https://www.canva.com/uploads/Msd59349ff

    The Asset ID is the value at the end of the URL (Msd59349ff in this example).

How is this guide?

Last updated on

On this page