🎨 Brand Kit Colors are now in Beta!

Announcements
, ,
1

Hey folks! Excited to announce getBrandKitColors, a new beta API for reading Brand Kit colors. Your app can now read colors directly from the current Brand Kit for the design.

What it does

Use this anywhere your app needs Brand Kit colors, from previews and default colors to keeping added or edited content on-brand.

If your app cares about brand compliance specifically, pair this with the brandColorsEnforced field on getDesignMetadata to know whether Brand Color Controls are active for the design. For background on Brand Controls, see this Help Centre article.

How to use it

import { getBrandKitColors } from "@canva/design";

const { palettes } = await getBrandKitColors();
const solidColors = palettes
  .flatMap((p) => p.colors)
  .filter((c) => c.type === "solid");

Notes:

  • Only solid colors are currently supported (gradients are unsupported).

  • getBrandKitColors returns the colors from the current Brand Kit for the design at the time of the call. If your app needs the latest values later, call it again.

For more info, see the getBrandKitColors API reference docs.

Related color APIs: openColorSelector for opening a color selector, and getDesignColors for reading the colors already used in the design.

As a reminder, apps using Beta APIs can’t be released on the Canva Apps Marketplace yet, but they can still be used in private apps.

We’re looking to move this to GA over the next couple of weeks, so we’d love your feedback if you try it out. Let us know how it fits your use case!

3 Likes
2

getBrandKitColors has now been moved to GA! Apps using this API can now be released on the Canva Apps Marketplace.