How can I add a custom font to the Habitat theme?

Store Design
1

I’m using the Habitat theme, and I want to add this custom font: https://freefontsvault.com/download/eras-font/

What should I do? I added one of the font-files in the Assets tab and placed the code below in theme.liquid but it still didn’t show up in the editor in the choices for fonts. Can anyone help me out?

{% style %}
@font-face {
font-family: ‘Eras’;
src: url(‘{{ ‘Eras.woff2’ | asset_url }}’) format(‘woff2’),
font-weight: normal;
font-style: normal;
font-display: swap;
}

{% endstyle %}