Aside from the built-in fonts, JotForm also supports At-rules (e.g. @importand, @font-face). You can use these to import your custom fonts from Google Fonts or fonts hosted on your server.
Import Fonts From Google Fonts
- Get your Google Fonts import code at https://fonts.google.com/
- Go back to the Form Designer under the Styles tab and make sure to paste the import code on top of all the existing CSS codes you may have.
- To apply the imported fonts in your form, simply use the font-family property.
- You can use the following code:
Replace Raleway with your Google Fonts name. Or, you can go back to Google Fonts where you have copied your import code. You’ll see the font-family property with the font name in it.
You can copy it and paste it on the .form-all class.
Use Custom Fonts Hosted From Your Server
You can use the following sample code and paste it on the Form Designer. After that, replace the required values e.g. the font-family name and the source of the font. Or, for browser compatibility, you can generate your @font-face codes using this tool: https://transfonter.org/.
If you have questions, post them below.