How to set super thin "font-weight" (less than 100) in CSS?

Question

I want to make the text super thin, smaller

font-weight: 100 

Is this possible with CSS?

Like this, but with helvetica:

Answer 1

The weight of the font displayed by the font must be available in the selected font. If the font weight does not exist in this set, you cannot select it using CSS. That's why you need to see what weights are available in the font of your choice. Such things are listed, for example, on Google Fonts, but font companies usually list which scales are available, whether they are free or purchased.

For example, Open Sans displays its lightest weight as 300. If you set it to 100, you will not see anything other than if you set it to 300, the reason 100 does not exist.

Despite all this, you say that you want to set the weight to something less than 100. However, less than 100 are not part of the CSS standard so no, you cannot do this.

Answer 2

CSS font weight does not “make fonts thin” (or bold) when working with web fonts. For fonts not downloaded from -y-url, the font-weight value displays from ultra thin to extra bold, but for custom fonts, the weight "whatever the @ font-face font binds, it should be": it's just numbers differentiations used when declaring a font family with multiple weights.

The following is a CSS declaration for a web font that uses three weights, but take a close look at the font resource and font weight:

 @font-face { font-family: "Helvetica Neue"; font-weight: 800; src: url(helveticaneue-ultrathin.woff); } @font-face { font-family: "Helvetica Neue"; font-weight: 400; src: url(helveticaneue-regular.woff); } @font-face { font-family: "Helvetica Neue"; font-weight: 100; src: url(helveticaneue-ultrathin.woff); } 

This gives us one CSS-declared font family with three specific weights (using a value other than 100, 400, or 800 will result in undefined behavior). Now two of these weights point to the same font resource .

The following code will style the text using an ultra-thin font, although CSS uses a weight of 800, which for standard fonts usually means “pretty darn bold”:

 <p style="font-family: 'Helvetica Neue'; font-weight:800">This is thin!</p> 

So, if you want to use the thin font of a super duper: go for it. But this has nothing to do with the CSS font-weight value and everything related to the you value, assign it in your @ font-face rule, and then use it in your CSS font.

Answer 3

You can find the font here ..: https://www.facebook.com/RITCreative/app/208195102528120/

Instead of relying on the impossibility of creating a font so that the magic becomes real, use Font Forge to create your own font.

What you probably want is Helvetica Nue installed on Mac computers.

Anyway, look at Google fonts and use Filters: Thickness, like what Rob suggested.