Text elements

• As a native element
• As part of an app element

The following snippet demonstrates how to add a text element to a design as a native element:

import React from "react";
import { getDesignInteraction } from "@canva/design-interaction";

export const App = () => {
  const designInteraction = getDesignInteraction();

  const handleClick = () => {
    designInteraction.addNativeElement({
      type: "TEXT",
      children: ["Hello world"],
    });
  };

  return (
    <div>
      <button onClick={handleClick}>Add text element</button>
    </div>
  );
};

To learn more, see Creating native elements.