Skip to content
SuiteAnvil
Brand kit · webflow.com

Webflow brand kit

Webflow's public website pairs #146EF5 with #3B89FF accents on a dark carbon canvas, sets headings in WF Visual Sans and uses a technical UI geometry. 7 of 10 key color pairings pass WCAG 2.1 AA.

Unofficial · compiled from webflow.comSnapshot 11 Nov 2026Technical · 4-6 px

Compiled by SuiteAnvil from the public website of webflow.com. Not affiliated with or endorsed by Webflow; Webflow and its trademarks belong to their owner. Own webflow.com? Claim this kit

Logo files

SVG · PNG

Vector symbol from the Simple Icons project (CC0 path data), drawn in Webflow's mark color #146EF5. The mark itself is a trademark of its owner.

01Brand colors

Click a swatch to copy its hex value
RoleHEXRGBLabel color on it
Primary#146EF5rgb(20, 110, 245)#FFFFFF · 4.59:1
Secondary#7A3DFFrgb(122, 61, 255)#FFFFFF · 5.33:1
Accent#3B89FFrgb(59, 137, 255)#111113 · 5.58:1
Surface#080808rgb(8, 8, 8)#FFFFFF · 20.03:1
Text#FFFFFFrgb(255, 255, 255)#111113 · 18.86:1
Extended palette

02Typography

Display48 / 52 · 650

Webflow

Heading 136 / 40 · 650

Clarity at every size

Heading 226 / 32 · 600

A section title in the brand face

Heading 319 / 26 · 600

Subsection and card titles

Body16 / 26 · 400

Body copy set in WF Visual Sans Text at reading size, with a comfortable measure for longer press releases and product pages.

Caption13 / 18 · 500

Captions, labels and UI microcopy

Mono13 / 20 · 400

#146EF5 #7A3DFF #3B89FF

Headings
WF Visual Sans
Not freely licensed here: previewed with Poppins
Body
WF Visual Sans Text
Not freely licensed here: previewed with Inter
Mono / data
Inconsolata
Google Fonts family, shown as is

Fonts load through SuiteAnvil's own proxy, so your browser never contacts a font CDN. Licensing a proprietary face is up to you.

03UI geometry & surface

Webflow
Card radius 8px · control radius 4px
name@webflow.com
Primary actionSecondaryAccent
Radius style
Technical · 4-6 px
Buttons and inputs
4px
Cards and panels
8px
CSS radius scale
2px / 4px / 8px
Surface tone
Dark carbon
Canvas · card · border
#080808 · #171717 · #363636
Dark mode canvas · text
#0A0E14 · #F5F5F7

04Usage notes

Derived from the public website

SuiteAnvil derived these notes from the logo, colors and contrast measured on webflow.com on 11 Nov 2026. They are practical defaults, not Webflow's official brand guidelines. Where Webflow publishes its own rules, those win.

Clear space

Keep free space of at least half the logo height on every side (dashed line). Nothing else, including text and edges of photos, enters that zone.

Minimum size

Screen
24 px
Print
8 mm

Logo height, for the compact symbol (aspect ratio 1.00:1). Below that, use the square icon or set the name in WF Visual Sans instead.

Color pairings that pass WCAG

  • AaBody text on surface20.03:1AAA
  • AaSecondary text on surface8.72:1AAA
  • AaButton label on primary4.59:1AA
  • AaAccent on surface5.92:1AA
  • AaWhite on secondary5.33:1AA
  • AaDark mode: text on canvas17.76:1AAA

Large text or decoration only: #146EF5 on #080808 (4.37:1, use #1871F8 for body text); #7A3DFF on #080808 (3.76:1, use #8256FF for body text); #FFFFFF on #FFFFFF (1.00:1, use #777677 for body text).

Do not recolor

  • Use the logo in #146EF5, in solid black or in solid white only. Do not swap in other palette colors, gradients or tints.
  • Avoid placing the #146EF5 logo on #7A3DFF and #3B89FF: contrast stays below 3:1. Use the white or black version there.
  • Do not stretch, rotate, outline, crop or add shadows and effects.
  • Do not rebuild the logo from a font; download the file above.
Embed on your site (free)Link the Webflow press kit or show the live brand score badge.
Option A: footer link

A plain text link to the hosted press & brand kit, e.g. in your site footer or press page.

<a href="https://suiteanvil.com/kit/webflow.com">Press &amp; Brand Kit</a>
Option B: live score badge
Brand and WCAG score for webflow.com by SuiteAnvil

The badge links to the audit and updates after each rescan. Score: mean of brand consistency and the share of WCAG 2.1 AA color pairings.

<a href="https://suiteanvil.com/audit/webflow.com"><img src="https://suiteanvil.com/api/badge/webflow.com.svg" alt="Brand and WCAG score for webflow.com by SuiteAnvil" height="20"></a>
Option B in Markdown (GitHub README)
[![Brand and WCAG score for webflow.com by SuiteAnvil](https://suiteanvil.com/api/badge/webflow.com.svg)](https://suiteanvil.com/audit/webflow.com)

Is this your company? Claim this kit

Verify that you control webflow.com to turn this into the official Webflow press kit: the “verified” label for free, plus a press contact block and whitelabel mode on Pro. Verification takes one meta tag or one DNS TXT record.

Webflow brand kit FAQ

Is this the official Webflow press kit?

No. SuiteAnvil compiled this kit from the public website of webflow.com on 11 Nov 2026. It is not affiliated with or endorsed by Webflow, and Webflow's trademarks belong to their owner. Whoever controls webflow.com can claim and verify it.

How can I download the Webflow logo?

Use the SVG or PNG download at the top of this page; the file is generated in your browser from a vector symbol (Simple Icons, CC0 path data). Check Webflow's trademark rules before publishing it.

What are Webflow's brand colors?

Primary #146EF5, secondary #7A3DFF and accent #3B89FF, on a #080808 surface with #FFFFFF text (snapshot from 11 Nov 2026). Click any swatch to copy the hex value.

What font does Webflow use?

Headings use WF Visual Sans (free stand-in: Poppins) and body text WF Visual Sans Text (free stand-in: Inter). Proprietary faces are previewed with the closest free Google Fonts family, loaded through SuiteAnvil's privacy proxy.

Which Webflow color pairings pass WCAG?

7 of 10 key pairings pass WCAG 2.1 AA (4.5:1), for example #FFFFFF on #080808 at 20.03:1 and #ABABAB on #080808 at 8.72:1. 3 pairings should be kept for large text or decoration only.

How do I link to this press kit from webflow.com?

Open "Embed on your site (free)" on this page and copy the footer link or the live score badge. Both point to SuiteAnvil pages that update after every rescan of webflow.com.

Compiled by SuiteAnvil from the public website of webflow.com (snapshot 11 Nov 2026). SuiteAnvil is not affiliated with or endorsed by Webflow. Webflow and its marks belong to their owner.

SuiteAnvil extracts publicly visible design tokens, logos, and font references for workflow automation. You are responsible for ensuring you hold valid commercial rights or client authorization for any proprietary fonts, trademarks, and brand assets before commercial publication. Licensing notice

Press Kit & Brand Tokens automatically maintained by SuiteAnvil. Build yours from one URL