Google Fonts not rendering properly

I imported a font called Roboto Light from google fonts.
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;300&display=swap');

It works perfectly in the preview next to the code, until I open my website on browser, and instead of Roboto Light, it displays roboto.

  font-family: "Roboto";
  color: black;
  margin: 0;
}

why is this happening?

Try setting font-weight: 100 or 300 in the CSS for the text you want to be light.

2 Likes

thanks! this solved my problem!