Jump to content
Typography.Guru
Sign in to follow this  
Seppl

answered The Verge Typeface

Recommended Posts

Seppl

Hey there,

I'm looking into copying The Verges Font Style for Body font. I know it's Helvetica, but there are so many Helvetics out there. Which one would I need to buy so it's the right font? Thank you!

 

Share this post


Link to post
Ralf Herrmann

It’s the one on your computer. :winking:

They don’t deliver a webfont for the body copy. They just instruct the browser to use Helvetica on the reader’s device or to use the default sans-serif font. 

.c-entry-content {
    font-family: Helvetica, sans-serif;
    font-weight: 300;
}

 

Share this post


Link to post
Seppl

Thanks. Are you sure about that? Then what am I seeing here? https://prnt.sc/hx532r

 

Isn't that Helvetica? Because I don't have Helvetica installed.

Share this post


Link to post
Ralf Herrmann

That’s just Arial, which is the “sans-serif fallback” as mentioned above. 

Share this post


Link to post
Riccardo Sartori
29 minutes ago, Seppl said:

Isn't that Helvetica?

No, that’s Arial.

Share this post


Link to post
Seppl

Ah, I see. Thank you. So when I want the font on my page look like that, what settings would I need to configure? Because choosing the same height in relation and font color, it looks very different from what I'm seeing on The Verge. Also it seems like I can't find a 300 weight version of Arial.

Share this post


Link to post
Riccardo Sartori
57 minutes ago, Seppl said:

I can't find a 300 weight version of Arial

According to Mozilla:

Quote

for fonts that provide only normal and bold, 100-500 are normal, and 600-900 are bold.

 

Share this post


Link to post
Seppl

Ok, thanks. I'll play around with the CSS-settings then till I achieve that look.

Share this post


Link to post
Seppl

So, I have a question. Albeit it being just Arial, I just don't get size and line-height quite right so that it looks about the same as with The Verge. Is there any special trick they applied? Or is there any trick on how to recalculate font settings for my own page? It seems like font size isn't font size, depending on the framework.

Share this post


Link to post
Ralf Herrmann

Nothing special going on. These are the settings applied to the paragraphs:

font-size: 18px;
line-height: 1.6;
margin-bottom: 1.2rem;
text-rendering: optimizeLegibility;
color:#424242;

 

Share this post


Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this  
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. You can also check out our Privacy Policy