Custom Font - Where Do I Find It?

So I uploaded a custom font and then did the CSS code for custom fonts.
Here it is below:
 

@font-face {
  font-family: 'Nexa-extra-light';
  src: url('https://static1.squarespace.com/static/65425d16b7fc5a251e0faf1a/t/65492c395bb98c660cfeeab1/1699294265092/nexa-extralight-webfont.woff2') format('woff2'),    url('https://static1.squarespace.com/static/65425d16b7fc5a251e0faf1a/t/65492c39aa303b246f30fd2e/1699294265271/nexa-extralight-webfont.woff') format('woff');
}
@font-face {
  font-family: 'Nexa-heavy';
  src: url('https://static1.squarespace.com/static/65425d16b7fc5a251e0faf1a/t/65492c386469a413cae44663/1699294265153/nexa-heavy-webfont.woff2') format('woff2'),    url('https://static1.squarespace.com/static/65425d16b7fc5a251e0faf1a/t/65492c39e7f70d00d0695715/1699294265177/nexa-heavy-webfont.woff') format('woff');
}
/* Custom Heading Fonts */
h1, h2, h3, h4 {
  font-family:'Nexa-heavy' !important;
}

/* Custom Paragraph Fonts */
p {
  font-family:'Nexa-extra-light' !important;
}

I see the changes from the client side of things, but I ca't actually find it as an option on the backend of font options. Any idea why?

Thanks for any help.

When you add custom fonts with code, it won't show up in places where you select fonts, you have to use CSS to assign the font manually (like the last line of your code).

@Vigasan thanks for that reply. So am I correct in assuming there isn't a way to add a new font that will show up in places you normally select fonts? Thank you for your kindness in your response. Stepping into some new territory with this. Got kind of assigned a job outside my current skillset.

2 minutes ago, Josh-KJM said:

@Vigasan thanks for that reply. So am I correct in assuming there isn't a way to add a new font that will show up in places you normally select fonts? Thank you for your kindness in your response. Stepping into some new territory with this. Got kind of assigned a job outside my current skillset.

Yes, that's correct, there was a way on Squarespace 7 (not 7.1) with a lot of code, but it wasn't worth the hassle in my opinion. So for custom fonts, you'll have to right click the text you want to assign a font too, find a class name, and then use CSS to target that class and assign it the font you want.

@Vigasan is that difficult code to implement to get it to recognize a programed font as something else? Or should I not really worry about being able to choose a font to change since the CSS code is already doing all the work? I'm just thinking through usability for some of my team that will be working the site as well and that if somethign got changed by accident or something it woud be easy for them to click the font back that they want.

Any thoughts on that?

28 minutes ago, Josh-KJM said:

@Vigasan is that difficult code to implement to get it to recognize a programed font as something else? Or should I not really worry about being able to choose a font to change since the CSS code is already doing all the work? I'm just thinking through usability for some of my team that will be working the site as well and that if somethign got changed by accident or something it woud be easy for them to click the font back that they want.

Any thoughts on that?

When you pick a font, it doesn't add any unique identifiers to classes, so it would be difficult to target elements that have specific fonts assigned.

I'm fairly sure this won't work on 7.1, but you can give it a shot (I haven't tried yet).
https://www.squarewebsites.org/blog/how-to-add-custom-fonts-to-squarespace-site