Skip to main content
J
juanr36816228
Participant
August 7, 2019
Answered

Is it possible to change the "nominal" weight of a font via CSS?

  • August 7, 2019
  • 1 reply
  • 633 views

I want to start using VAG Rundschrift on my website. It has two weights: a light version and a regular version that actually looks bold or black.

The issue is: it is the Regular, bold-like version the one that is shown when setting the font-weight as "normal" via CSS. For the Light weight, I need to specify font-weight: 300. Is it possible to set the Regular version as bold (when using font-weight: bold or font-weight: 700) and the Light version as normal (as default weight, font-weight: normal or font-weight: 400)? I know it would be doable if loading the font files directly via my CSS, but not sure how to do it while using the Typekit stylesheet.

Thank you!

    This topic has been closed for replies.
    Correct answer HARSHIKA_VERMA

    Hi there,

    Unfortunately, this isn’t possible. The font-weight for each variation is assigned in our backend and at this time, there isn’t a way to specify this in the web project settings. However, there is some CSS that might help with this.

    You could create classes to make this a little easier:

    .bold-round {

    font-weight: 400;

    }

    .reg-round {

    font-weight: 300;

    }

    Then, add these classes to any elements in your HTML. It’s not the prettiest solution but it might make things work smoother for your workflow. I’ll let the team know you’d like some more features to customize the web project.

    Please let me know if that helps.

    Thanks,

    Harshika

    1 reply

    HARSHIKA_VERMA
    Community Manager
    HARSHIKA_VERMACommunity ManagerCorrect answer
    Community Manager
    August 7, 2019

    Hi there,

    Unfortunately, this isn’t possible. The font-weight for each variation is assigned in our backend and at this time, there isn’t a way to specify this in the web project settings. However, there is some CSS that might help with this.

    You could create classes to make this a little easier:

    .bold-round {

    font-weight: 400;

    }

    .reg-round {

    font-weight: 300;

    }

    Then, add these classes to any elements in your HTML. It’s not the prettiest solution but it might make things work smoother for your workflow. I’ll let the team know you’d like some more features to customize the web project.

    Please let me know if that helps.

    Thanks,

    Harshika

    Terms & ConditionsAccessibility statement
    Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices