Fonts

The fonts canva.com uses

canva.com sets its headlines and body text in Canva Sans. Canva Sans is a licensed font the site serves itself. The closest free match on Google Fonts: Inter.

Measured from canva.com 4 days ago.

Font families

1 family
Canva Sans
Used for
h1, h2, h3, body, button
Source
Self-hosted
Free alternative
Inter

CSS to reproduce it

Font variables with the free stand-in in the stack, so the same CSS works with or without the licensed font.

:root {
  --font-heading: "Canva Sans", "Inter", sans-serif; /* Inter stands in for Canva Sans */
  --font-body: "Canva Sans", "Inter", sans-serif; /* Inter stands in for Canva Sans */
  --font-size-base: 18px;
}

How the type is set

headline-displayQuick brown foxCanva Sans / 84px / 400 / lh 89.04px / -1.5px
headline-lgQuick brown foxCanva Sans / 56px / 400 / lh 61.6px / -0.56px
headline-mdQuick brown foxCanva Sans / 28px / 500 / lh 35px / -0.28px
body-mdThe quick brown fox jumps over the lazy dogCanva Sans / 18px / 400 / lh 25.2px
label-mdThe quick brown fox jumps over the lazy dogCanva Sans / 13px / 400 / lh 1.4
buttonThe quick brown fox jumps over the lazy dogCanva Sans / 14px / 600 / lh 22px
Font sizes in use
1013141624283264

For AI agents

The pack is plain text, no key: fetch DESIGN.md, or hand the whole pack to Claude Code, Cursor or Copilot with the MCP server.

curl -s https://stylepack.ai/packs/canva.com/DESIGN.md

Questions

What font does canva.com use?

canva.com uses Canva Sans. Headlines are set in Canva Sans and body text in Canva Sans, measured from the site as it renders, not read from its stylesheet.

Is the canva.com font free to use?

No. Canva Sans is a licensed font that canva.com serves itself. The closest free match is Inter, available on Google Fonts. The CSS on this page puts it in the font stack as the stand-in.

How do I get the same typography as canva.com in my project?

Download the canva.com design pack from Stylepack: it holds the font stack, the type scale, every text style and the screenshots, in a form an AI coding agent such as Claude Code or Cursor can build from.