How to use custom fonts on form

  • anyroad
    Asked on April 24, 2024 at 5:50 PM

    Hello! I am setting up a gift voucher and the customer want it to be set up in spectral which I do not see available. Is there a work around? Thank you!

  • Sigit JotForm Support
    Replied on April 24, 2024 at 8:23 PM

    Hi anyroad,

    Thanks for reaching out to Jotform Support. I understand that you'd like to use custom fonts on your forms. In Jotform, you have the option to use customs fonts on your online form by importing your fonts to your form. You'll be using custom CSS codes for this. Please refer to this guide on how to do that.

    Since Spectral is a Google Font, you can use the following sample CSS code and inject it into your form. Please remember to replace the required font-family and src values with your font’s name and source URL.

    @import url('https://fonts.googleapis.com/css2?family=Spectral:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;0,800;1,200;1,300;1,400;1,500;1,600;1,700;1,800&display=swap');
    * {
    font-family: 'Spectral', sans-serif;
    }

    Let me show you how.

    1. In the Form Builder, select the Paint Roller icon in the upper-right corner.
    2. In the Form Designer panel on the right, go to Styles at the top.
    3. Scroll down to Inject Custom CSS and enter your CSS code in the textarea — all changes are saved automatically.

    As shown in the screencast below:

    How to use custom fonts on form Image 1 Screenshot 20

    Give it a try and let us know if there's anything else we can do for you.

 
Your Answer