> ## 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.

# Brand guidelines

Learn how to integrate the Canva brand into your product.

When integrating Canva into your product it's important to maintain the integrity of the Canva brand because it helps our users feel at home with your product right away.

## What logos or branding can I use?

### Canva brand name

<table>
  <thead>
    <tr>
      <th>Do</th>
      <th>Don't</th>
    </tr>
  </thead>

  <tbody>
    <tr valign="top">
      <td>
        <DoText>
          **Do indicate that your app is compatible with Canva.**

          For example:

          <ul style={{ paddingLeft: 28 }}>
            <li>for Canva</li>
            <li>for use with Canva</li>
            <li>works with Canva</li>
            <li>compatible with Canva</li>
          </ul>
        </DoText>
      </td>

      <td>
        <DontText>
          **Don't imply that your app is created, endorsed, or certified by Canva.**

          For example:

          <ul style={{ paddingLeft: 28 }}>
            <li>by Canva</li>
            <li>from Canva</li>
          </ul>
        </DontText>

        <DontText>
          **Don't alter or play on the word ‘Canva’.**

          For example:

          <ul style={{ paddingLeft: 28 }}>
            <li>bcaNva</li>
            <li>Canva-fy</li>
          </ul>
        </DontText>

        <DontText>
          **Don’t use terms that could confuse your app with Canva’s existing features.**

          For example:

          <ul style={{ paddingLeft: 28 }}>
            <li>Magic</li>
          </ul>
        </DontText>
      </td>
    </tr>
  </tbody>
</table>

## Logo use guidelines

You can [download assets of the Canva logo](https://www.canva.dev/assets/connect/Canva-logos.zip), but you must use it only in the approved ways described in this guide.

* Don't use the logo in any external communications or marketing in a way that might confuse the Canva brand with your product.
* Don't use the Canva logo for your company’s identity, or for other uses that aren't directly related to your app.

Note: You must include either the logo or Powered by Canva message to users as part of the entry point to your app. You must also include this on any modals or UI specifically designed to allow users to interact with Canva, such as a design picker modal.

| Description                                       | Example |
| ------------------------------------------------- | :-----: |
| For surfaces **below 50px**, use the icon logo.   |         |
| For surfaces **above 50px**, use the script logo. |         |

## Do

<Grid columns={1} spacingX="6u" spacingY="3u">
  <Card
    border={false}
    description={
  <>
    <Strong>DO</Strong> ensure a minimum padding of 8px around the logo on all
    sides, to maintain clear visual separation from other elements.
  </>
}
  />
</Grid>

<Grid columns={2} spacingX="6u" spacingY="3u">
  <Card
    border={false}
    description={
  <>
    <Strong>DO</Strong> display the Canva logo, "POWERED BY CANVA," or use a
    dedicated Canva section or title on the main page or initial flow of your
    app.
  </>
}
  />

  <Card
    border={false}
    description={
  <>
    <Strong>DO</Strong> use the "Icon logo" exclusively for embedding Canva
    into your product's user interface.
  </>
}
  />
</Grid>

## Don't

<Grid columns={2} spacingX="6u" spacingY="3u">
  <Card
    border={false}
    description={
  <>
    <Strong>DON'T</Strong> change the shape or minimum padding of the logo.
  </>
}
  />

  <Card
    border={false}
    description={
  <>
    <Strong>DON'T</Strong> use any version of the logo that hasn't been
    approved in these guidelines.
  </>
}
  />

  <Card
    border={false}
    description={
  <>
    <Strong>DON'T</Strong> alter the Canva logo colors to match your branding,
    or for any other reason.
  </>
}
  />

  <Card
    border={false}
    description={
  <>
    <Strong>DON'T</Strong> stretch, compress, or distort the logo's aspect
    ratio.
  </>
}
  />

  <Card
    border={false}
    description={
  <>
    <Strong>DON'T</Strong> combine the Canva logo with other logos or brands
    without explicit permission from Canva.
  </>
}
  />
</Grid>

## Examples of the Canva logo in use

<Grid columns={2} spacingX="6u" spacingY="3u">
  <Card
    border={false}
    description={
  <>
    <Strong>Example:</Strong> Slack
  </>
}
  />

  <Card
    border={false}
    description={
  <>
    <Strong>Example:</Strong> Microsoft Teams
  </>
}
  />
</Grid>