Для подключения шрифтов в HTML используется директива @font-face.
С её помощью можно подключить и использовать на странице любой шрифт из файла. При загрузке сайта браузер будет брать шрифт из указанного файла и отображать текст именно этим шрифтом.
Внутри правила @font-face должно быть два обязательных свойства:
Название шрифта, которое будет использоваться в CSS (свойство font-family).
Ссылки на файлы, из которых браузер может взять шрифт (свойство src). Важно указать ссылки на файлы в нескольких форматах, чтобы любой браузер — старый или новый — мог загрузить шрифт в понятном ему формате.
Принято хранить и подключать шрифты в форматах WOFF, WOFF2, SVG.
https://itchief.ru/html-and-css/fonts#font-face
и 
