Using web fonts make the content render using the specified font uniformly across all devices. There are multiple ways to include and use web fonts on a website.

1. First declare a font-face with a font-family and link to the web font.

@font-face {
  font-family: 'Manjari';
  src: url("/assets/font/Manjari.woff2") format('woff2');
}

2. Then add a class which uses the specified font-face as the font-family.

.manjari {
  font-family: "Manjari", system-ui, -apple-system, sans-serif;
  font-weight: normal;
  line-height: 1.5;
}

3. Then use the class like any normal css class.

<div class="manjari">hello hello</div>

With this method, the font will only load if the browser detects the usage of the specific class. It will lazy load and is efficient in that aspect.