What is JotForm?
JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.

At JotForm, we want to make sure that you’re getting the online form builder help that you need. Our friendly customer support team is available 24/7.

We believe that if one user has a question, there could be more users who may have the same question. This is why many of our support forum threads are public and available to be searched and viewed. If you’d like help immediately, feel free to search for a similar question, or submit your question or concern.


  • Profile Image

    Can I use my own fonts on the form?

    Asked by Shannon  on September 25, 2014 at 02:58 PM

    I would like to include either HTML or CSS style or just have the font default to my website. Is this possible? Thank you.

    Page URL:
    http://www.indianmotorcycle.com/en-us/self-help/article/becoming-a-ven<br/>dor-or-supplier

    Screenshot
    font form font custom font google web font
  • Profile Image

    Answered by Mark on September 25, 2014 at 05:29 PM

    Hi,

    Can you please use the code below and inject into your form to fix the issue?

    /* latin */

    @font-face {

    font-family: 'Rokkitt';

    font-style: normal;

    font-weight: 700;

    src: local('Rokkitt Bold'), local('Rokkitt-Bold'), url(http://fonts.gstatic.com/s/rokkitt/v8/Mef17w3J4CtS0lw4Wa_8ryEAvth_LlrfE80CYdSH47w.woff2) format('woff2');

    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;

    }

    .form-all {

    font-family: 'Rokkitt', serif;

    }

    Here's how it looks like after: http://www.jotformpro.com/form/42676787644977

    Feel free to contact us again if you need further assistance.

  • Profile Image
    JotForm Support

    Answered by Mike_T on September 25, 2014 at 05:32 PM

    There are some options that you might consider:

    1) Inject a custom CSS to the form in order to use different font.

    How to Inject Custom CSS Codes

    2) Get a full source code and update it on your web page with the styles you need.

    How to get the Full Source Code of your Form

    3) Use a Google Web Fonts option.

    Beautify your Form with Google Web Fonts

    4) Select one of predefined fonts via a Form Style tab.

    Thank you.