font inspectorWhat font does Webflow use?
Webflow sets its whole site in one variable font and uses the axes deliberately: a display optical size for headlines, a text optical size for the interface.
Short answer: Webflow’s website uses WF Visual Sans, its own variable typeface, for every piece of text.
WF Visual Sans
Self-hosted100%- CSS name
WF Visual Sans Variable- Weights
- 400, 500, 550, 600
- Sizes
- 79.5px · 55.7px · 31.9px · 20px · 16px · 14px
- Served from
- cdn.prod.website-files.com
Sizes, weights and spacing by role
These are computed values from the live page, which is what the Font Inspector panel shows when you click each element.
| Role | Font | Size | Weight | Line height | Letter spacing |
|---|---|---|---|---|---|
| Headline | WF Visual Sans | 79.5px | 600 | 1.04 | -0.01em |
| Subheading | WF Visual Sans | 31.9px | 600 | 1.2 | normal |
| Body text | WF Visual Sans | 16px | 400 | 1.6 | normal |
| Navigation | WF Visual Sans | 15.9px | 500 | 1.2 | -0.01em |
The main font stack in the CSS:
font-family: "WF Visual Sans Variable", Arial, sans-serif;- The CSS sets the optical size axis by hand:
opsz100 for headlines and 20 for navigation. - Sizes such as 79.5px and 31.9px are fractional, a sign of fluid type that scales with the window.
- A weight of 550 is in use, halfway between Medium and Semi Bold.
Check any site yourself in one click.
Sites change their type without notice. Font Inspector shows the rendered font, size, weight and spacing of any text on webflow.com or anywhere else, and lists every font on the page. Free, no account.
About the fonts, and whether you can use them
WF Visual Sans
Webflow’s custom sans serif, a variable font covering weights 100 to 900 with an optical size axis.
Can you use it? It is proprietary to Webflow. Inter and Figtree are free sans serifs with a similar crisp, product-focused feel.
Finding a font does not license it. More in how to get a font you found, legally.
Get a similar look with a free font
This starter uses Inter, which is open source, with the sizes and spacing measured above. It is an approximation, not a copy of Webflow’s brand typeface.
/* Approximates the Webflow look with a free font */
body {
font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}
h1 {
font-size: 4.96875rem; /* 79.5px */
font-weight: 600;
line-height: 1.04;
letter-spacing: -0.01em;
}
p {
font-size: 1rem; /* 16px */
font-weight: 400;
line-height: 1.6;
}How we checked
We opened webflow.com in Chrome on September 21, 2026 and read the computed styles of its visible text: the declared font stack, the font actually rendered, and how much of the page’s text each family sets. That is the same data the Font Inspector extension shows under Fonts on this page. We re-check these pages periodically, and the date above shows the last inspection.
Webflow and its typefaces are trademarks of their respective owners. Font Inspector is not affiliated with Webflow.
Questions & answers
What font does Webflow use on its website?+
Webflow’s website uses WF Visual Sans, its own variable typeface, for every piece of text.
Can I use the Webflow font?+
It is proprietary to Webflow. Inter and Figtree are free sans serifs with a similar crisp, product-focused feel.
What is a free font similar to WF Visual Sans?+
Inter and Figtree are free on Google Fonts and give a similar feel. No free font is an exact match, so compare it with your own text first.
How can I check what font Webflow uses myself?+
Open webflow.com, then click any text with the Font Inspector extension, or right-click, choose Inspect and look at Rendered Fonts in the Computed tab. Sites change their typography, so checking the live page is the only way to be sure.