Stylepack

Fonts

The fonts figma.com uses

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

Measured from figma.com 4 days ago.

Open the full design packDownload the pack

Font families

2 families
figmaSans
Used for
h1, h2, h3, body, button, label
Source
Self-hosted
Free alternative
Inter
figmaMono
Used for
label
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: "figmaSans", "Inter", sans-serif; /* Inter stands in for figmaSans */
  --font-body: "figmaSans", "Inter", sans-serif; /* Inter stands in for figmaSans */
  --font-size-base: 30px;
}

How the type is set

headline-displayQuick brown foxfigmaSans / 56px / 400 / lh 56px / -1.25px
headline-lgQuick brown foxfigmaSans / 44px / 400 / lh 48.4px / -0.66px
headline-mdQuick brown foxfigmaSans / 16px / 400 / lh 22.4px
body-mdThe quick brown fox jumps over the lazy dogfigmaSans / 30px / 400 / lh 36px / -0.66px
label-mdThe quick brown fox jumps over the lazy dogfigmaSans / 16px / 400 / lh 22.4px
buttonThe quick brown fox jumps over the lazy dogfigmaSans / 16px / 400 / lh 23.2px
Font sizes in use
12141618304456

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/figma.com/DESIGN.md

Questions

What font does figma.com use?

figma.com uses figmaSans, figmaMono. Headlines are set in figmaSans and body text in figmaSans, measured from the site as it renders, not read from its stylesheet.

Is the figma.com font free to use?

No. figmaSans is a licensed font that figma.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 figma.com in my project?

Download the figma.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.