Creating designs

Search…

Creating designs

Create a design with the HTML API.

If you followed the steps for creating a Canva Button with the HTML API, the generated code provides a Button that, when clicked, creates a new design in the Canva editor:
1
<button
2
  data-design-type="Poster"
3
  data-api-key="API KEY GOES HERE"
4
  class="canva-design-button"
5
  style="display: none;"
6
  >Design with Canva</button
7
>
8
<script>
9
  (function (c, a, n) {
10
    var w = c.createElement(a),
11
      s = c.getElementsByTagName(a)[0];
12
    w.src = n;
13
    s.parentNode.insertBefore(w, s);
14
  })(document, "script", "https://sdk.canva.com/designbutton/v2/api.js");
15
</script>
Copied!
The presence of the data-design-type attribute on the button element tells Canva that clicking the Button should create a new design.
The value of the data-design-type attribute determines the design type of the created design. The design type determines:
the dimensions of the design
the templates that Canva shows to the user
For a complete list of the supported design types, refer to Design types.
If the button element has a data-design-type attribute, it must not have a data-design-id attribute. The attributes are mutually exclusive.

Last modified 1mo ago

Copy link