What fonts does Webstudio use?

Measured from the captured homepage: Manrope Extra for headings and Manrope Extra for body copy.

Webstudio website design referenceOpen full Webstudio reference →

Observed typography

Heading font
Manrope Extra
Body font
Manrope Extra
System
One family across both roles

How the page is built

Webstudio's captured homepage has 29 sections and 5 inner pages.

  • 15 content
  • 4 blog
  • 3 features
  • 2 statement
  • 1 faq
  • 1 hero
  • 1 pricing
  • 1 showcase
  • 1 testimonials

Other sites that use this pair

No other captured site in this library uses this same pair of fonts.

Captured colors

The captured homepage uses these 5 colors, in capture order.

  • #11181c
  • #fbfcfd
  • #515659
  • #e6e7e9
  • #d0d3d4

Styles recorded: Dark.

Same category, same heading font

0 of the 67 other captured Developer Tools sites in this library use Manrope Extra for headings.

Webstudio's website font choices

Captured September 21, 2026. Read it with the full reference, where the palette, section order and responsive views sit next to the type.

A single family or a two-font system?

Webstudio sets headings and body in Manrope Extra, so the hierarchy comes from scale and weight.

Compare it across the library

See the website font trends and the font pairing examples.

Webstudio fonts — FAQ

What font does Webstudio use?

Webstudio uses Manrope Extra for headings and Manrope Extra for body copy in the captured homepage.

Is Manrope Extra free to use?

Check the foundry license for Manrope Extra before shipping it. This page records what appeared on Webstudio's site and grants no reuse rights.

What colors and sections were captured for Webstudio?

5 colors (#11181c, #fbfcfd, #515659, #e6e7e9, #d0d3d4) and 29 homepage sections, with 5 inner pages.

Which other sites use Manrope Extra and Manrope Extra?

No other captured site in this library uses this same pair of fonts.

Fonts come from the rendered capture and may change when the site does. Library methodology