Canva colours and fonts
What Canva colours and fonts actually does
The usual way to get a colour out of a design is to click the element, open the colour panel and copy the hex, one swatch at a time, and the usual way to get the font is to remember what it was called. This reads the whole design at once. Export the design as PowerPoint, drop the file here, and every colour that is actually painted comes back with its hex, whether it is a fill, a line or text, how many times it is used and which pages it appears on, alongside every typeface with the sizes it is set at. The colours are the ones that render, not the ones in the theme table: a design that references a theme colour and then darkens it by forty percent is reported at the value you can see, because the luminance transform is applied rather than ignored. The result comes out as a block of CSS custom properties or as a design token file in the stable W3C format, and the code stays editable in the box before you copy it.
How to use it
- In Canva, open Share, then Download, and choose PowerPoint (PPTX) as the file type.
- Drop that file here. Every colour and typeface is listed with its usage count and the slides it appears on.
- Untick the ones that are noise, such as a colour used once on one border, and set a prefix if the names need one.
- Take the result as CSS custom properties, as a design token file, or as the full report, and edit the box before copying it.
Useful for
- Build the web page a design was mocked up for, without guessing the hex codes.
- Find the real font names a design asks for, so the right web font can be sourced instead of a substitute.
- Hand a developer one file of tokens instead of a screenshot and a colour picker.
- See how many colours a design really contains before calling it a brand palette.
Limits worth knowing
- Only declared colours are read. A colour that exists inside a photograph is part of the picture, not a value in the file, and will not appear.
- Text with no explicit colour inherits from its layout and is not reported, because a partly resolved inheritance chain would report a confident wrong value for body text.
- A gradient is reported as its separate stops rather than as one gradient token.
- A font name is the face the design asked for. Whether that face is free to use on the web is not something the file can say.
- Sizes are converted from points at the browser default of sixteen pixels to the rem, and the original point value is kept in a comment.
Questions people ask
Why does the hex differ from what the Canva colour panel showed?
A design can reference a theme colour and then modify its brightness. The stored value is the theme colour plus a transform; the rendered value is what you see. This reports the rendered value and names the theme slot it came from.
Does it work on PowerPoint and Google Slides files too?
Yes. Any .pptx is read the same way, whichever tool made it.
What format is the token file?
The W3C Design Tokens Format Module, in its stable shape, where a colour value is an object carrying a colour space and components rather than a hex string. The hex is included as well so the file is readable by eye.
Why are there so many colours?
Because designs contain more colours than their palettes claim. Every value is listed with a usage count so the ones used once can be dropped, and the minimum-uses control removes them in one step.
Is my design uploaded?
No. The file is opened and read in this tab, and the site has no upload endpoint.