Brand guide · figma.com

Figma

“The full-stack creative canvas”

Go from WIP to ship, together, on one creative canvas. Bring your teammates, AI agents, design context, and code into the same workspace to build better products.

Extracted from the live site on 2026-10-09 in 43s · 6 pages read · 4 TinyFish calls

Figma homepage as rendered by the TinyFish browser
Take it with you
01

Logo

Homepage
Homepage
Homepage
  • Taken from the rendered site header (19x28px on a 1440px-wide viewport).
  • Vector SVG with computed fills inlined, so it renders the same outside the site.
02

Colour

Contrast pairings

AaBody text on page background21:1 · AAA
AaText on primary9.14:1 · AAA
AaMuted text on page background4.59:1 · AA
AaPrimary on page background2.3:1 · Fail
AaText on light purple accent9.43:1 · AAA
AaText on light green accent9.86:1 · AAA
10 colour variables found in the site's CSS
--fig-theme-btn-primary-bg: #000000 --fig-theme-btn-primary-fg: #FFFFFF --fig-theme-fg: #000000 --global-statsig-overlay: #FFFFFF --fig-theme-form-error-fg: #FFFFFF --fig-theme-form-error-bg: #972121 --fig-theme-bg: #FFFFFF --fig-theme-btn-transparent-fg: #000000 --fig-theme-badge-fg: #000000 --fig-theme-btn-secondary-fg: #000000
03

Typography

Aa

figmaSans

sans-serif · self-hosted · used for display, heading, subheading, body, navigation, button

Weights 320 · 400

figmaSans, "figmaSans Fallback", "SF Pro Display", system-ui, helvetica, sans-serif
displayfigmaSans · 56px · 400 · 1 · -0.022em

The full-stack creative canvas

headingfigmaSans · 30px · 400 · 1.2 · -0.022em

Move fast in the right direction on an AI-native canvas.

subheadingfigmaSans · 16px · 400 · 1.4

Design anything you can imagine

bodyfigmaSans · 16px · 400 · 1.4

Ask Figma’s agent to add motion to designs, document your design systems, implement feedba

navigationfigmaSans · 16px · 400 · 1.45

Pricing

buttonfigmaSans · 16px · 400 · 1.45

Get started

Buttons as rendered

Get startedbg #000000 · text #FFFFFF · radius 16px
04

Tone of voice

Figma pairs creative ambition with practical building language. Its voice is collaborative, action-led, and fluent in design and development, with occasional maker shorthand and playful warmth.

Together by default

Frames creativity and product development as shared work, not individual heroics.

Do

Describe how teammates contribute, align, and build in the same space.

Don't

Position a lone genius or individual ownership as the source of great products.

How it sounds on their site

“Made so your whole team can go from WIP to ship, together.” home
“Our vision is to make design accessible to all because we know that nothing great is made alone.” /careers

Expressive and exact

Balances imaginative possibility with precision, craft, and intentional execution.

Do

Pair creative outcomes with concrete controls, context, or tools that make them achievable.

Don't

Celebrate limitless creativity without explaining how people can refine or build it.

How it sounds on their site

“Powerfully expressive. Incredibly precise.” home
“We build for builders and try to make complex things feel simple.” /careers

Momentum with intention

Promises speed while insisting on alignment, consistency, and the right outcome.

Do

Use active verbs and connect faster work to better decisions or faithful delivery.

Don't

Treat speed as a reason to skip craft, context, or feedback.

How it sounds on their site

“Move fast in the right direction on an AI-native canvas.” home
“Start with design context. Build with consistency.” home

Maker-minded warmth

Uses insider language and playful phrasing to make ambitious technical work feel human.

Do

Use familiar maker terms sparingly and welcome exploration alongside practical work.

Don't

Use stiff corporate abstractions or force jokes into feature and pricing explanations.

How it sounds on their site

“We’re multiplayer people who love the weird, wonderful magic that happens when people connect.” /careers
“Playing is learning.” /careers

Tone spectrum

FormalCasual
SeriousPlayful
TechnicalPlain
UnderstatedBold

Measured on 2,665 words

Sentence length
20.8 words
Reading ease
39 · Dense (college level)
Headings
Sentence case
“You” vs “we”
1.8 vs 1.4 per 100 words
Exclamations
0.8 per 100 sentences
Contractions
0.9 per 100 words

Style rules

  • Use sentence case for headings, preserving product names and acronyms.
  • Lead headings and CTAs with active verbs such as Build, Create, Explore, and Choose.
  • Keep headlines short; use fuller explanatory sentences around 20 words when describing workflows or capabilities.
  • Address the reader as you or your in product copy; use we and our for company values and culture.
  • Use em dashes to connect an outcome or aside, and paired short sentences for emphasis; keep exclamation marks and rhetorical questions rare.
  • Retain useful design and developer terminology, but connect it to an action or outcome; present pricing and limits with numerals and clear units.

Words we use

togetherbuilddesignteamscanvassharedcontextdesign systemscollaborationAIcraftfrom start to finish

Words we avoid

lone geniusautopiloteffortless perfectionsynergizeparadigm shiftone-size-fits-all

05

Messaging

One shared workspace, from idea to delivery

Figma brings teams and workflows together across the entire product development process.

“One workspace for your entire product development process.” home
“FigJam makes it easy to explore ideas with your team. Define the work, make decisions, and move forward—all in one place.” /solutions

AI with shared creative context

Figma puts AI alongside teammates and connects it to the context needed to generate, refine, and build.

“Teammates and AI agents work in the same space with shared context.” home
“Ask Figma’s agent to add motion to designs, document your design systems, implement feedback, and more.” home

Creative craft that carries through to code

Figma combines expressive design tools with connected development workflows to preserve intent through production.

“Every technical tool you need to dial in the details.” home
“Your context, codebase, and agents stay connected so what you design is what gets shipped.” home

Consistency at team and enterprise scale

Figma helps organizations share resources and scale design systems across teams, brands, and products.

“Manage and share design systems across multiple teams at your organization.” /pricing
“Scale design systems across multiple brands and products with extended collections.” /pricing

Audiences

  • Designers and product teams. Explore ideas, refine detailed designs, prototype experiences, and collaborate across the product development process.
  • Developers. Access design context, specifications, and connected tools so what gets designed is what gets built.
  • Organizations and enterprise teams. Scale shared design systems, centralize resources, and manage security and administration across products and departments.
  • Marketing teams and agencies. Create campaign assets quickly and coordinate client workflows from ideas through delivery.

Proof points

“95% of the Fortune 500 uses Figma” home
“Based on data from March 2025.” home
“Duotone moved their entire agency workflow into Figma. Today, they're saving 80+ hours per project.” /customers
“PhonePe unifies teams and design systems in Figma to serve 700+ million users.” /customers
“How Mercado Libre scales design for 100 million buyers across Latin America” /customers
“Uber keeps design consistent at scale with Figma’s design system and dev tools.” /customers

Key phrases

The full-stack creative canvasfrom WIP to shipBuild with intentionBuild with consistencybuild better products, togethernothing great is made aloneall in one placeLove your craft

Calls to action

Get startedGet started for freeRegister

Boilerplate

About Figma: Figma is a design platform for teams who build products together. Its tools help teams brainstorm, design, and build products from start to finish, with shared libraries, prototyping, developer tools, and AI capabilities. Serving solo founders through enterprise organizations, Figma connects workflows across teams and time zones. Based on March 2025 data, 95% of the Fortune 500 uses Figma.

06

How this was built

Every fact above traces to one of these calls. Quotes were checked against the fetched text: 22 kept, 0 dropped as not verbatim. Voice written by gpt-6.1-sol.

TinyFishPurposeResultTime
BrowserRender the live homepage to measure colours, type and logo
https://figma.com/
session tf-8d21d688-7fb0-4e8a-b1ee-2a863ce59e49; rendered 1315 elements in 15552ms, 3 bg colours, 1 font files, logo svg16.4s
FetchRead homepage copy, links and images for a brand guide
https://figma.com/
1/1 pages, 1533 chars1.6s
SearchFind official brand assets and guidelines
Figma brand guidelines logo colors press kit
9 results0.8s
FetchRead site pages for tone of voice, messaging and brand rules
https://www.figma.com/solutions, https://www.figma.com/pricing, https://www.figma.com/customers, https://www.figma.com/blog, https://www.fig…
5/5 pages, 33278 chars2.4s

Pages read