> ## Documentation Index
> Fetch the complete documentation index at: https://filla.io/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# Fonts

> Choose from a curated Google Font catalog, grouped by style, with live previews in the editor.

## How fonts work

Filla loads your chosen font from Google Fonts when a respondent opens your form. The font applies to all text on the form:

* Page titles
* Field labels
* Field descriptions
* Input text (what respondents type)
* Buttons
* The "Built with Filla" footer

## Choosing a font

<Steps>
  <Step title="Open the Form Settings Sidebar">
    Click on the canvas background to show the sidebar.
  </Step>

  <Step title="Open the Typography section">
    Expand the **Typography** accordion section.
  </Step>

  <Step title="Select a font">
    Click the **Font Family** dropdown and choose a font. Each option includes a live `Aa` preview so you can compare styles before selecting one. The form preview updates immediately.
  </Step>
</Steps>

Select **System default** to use the browser's native font stack (no external font loaded).

## Font groups

The font picker is organized into grouped sections:

* **System**
* **Featured**
* **Sans**
* **Serif**
* **Display**
* **Mono**

This makes it easier to compare fonts by style and mood instead of scrolling through one long list.

## Available fonts

Filla includes a larger curated catalog of Google Fonts, chosen for readability and versatility across form contexts:

| Font                                                                                                                                         | Group              | Best for                                     |
| -------------------------------------------------------------------------------------------------------------------------------------------- | ------------------ | -------------------------------------------- |
| **Inter**                                                                                                                                    | Featured / Sans    | Business forms, professional use             |
| **DM Sans**                                                                                                                                  | Featured / Sans    | Events, creative projects                    |
| **Plus Jakarta Sans**                                                                                                                        | Featured / Sans    | HR, onboarding, SaaS                         |
| **Manrope**                                                                                                                                  | Featured / Sans    | Lead gen, premium-feeling forms              |
| **Space Grotesk**                                                                                                                            | Featured / Display | Tech brands, bolder styling                  |
| **Lora**                                                                                                                                     | Featured / Serif   | Editorial and polished forms                 |
| **Playfair Display**                                                                                                                         | Featured / Serif   | Luxury, fashion, higher contrast             |
| **IBM Plex Mono**                                                                                                                            | Featured / Mono    | Technical or developer-facing forms          |
| **Outfit, Sora, Urbanist, Public Sans, Work Sans, Instrument Sans, Nunito, Rubik, Poppins, IBM Plex Sans, Open Sans, Roboto, Source Sans 3** | Sans               | Clean UI-focused typography                  |
| **Merriweather, Crimson Pro, Cormorant Garamond, Libre Baskerville, EB Garamond, Source Serif 4, Fraunces**                                  | Serif              | Editorial or traditional branding            |
| **Syne, Bricolage Grotesque, Archivo Black, Bebas Neue, Abril Fatface, Raleway, Quicksand, Comfortaa**                                       | Display            | Distinctive branded forms                    |
| **JetBrains Mono, Fira Mono, Source Code Pro**                                                                                               | Mono               | Technical, code-adjacent, structured layouts |

## Performance

Fonts are loaded via Google Fonts CDN with `display=swap` — the form renders immediately with a fallback font, then swaps in your chosen font once it's loaded. This prevents layout shift and ensures fast load times.

Font previews in the editor are lazy-loaded as they scroll into view, so a larger catalog does not slow down the editor unnecessarily.

## Common questions

<AccordionGroup>
  <Accordion title="Can I upload my own custom font?">
    Not currently. Filla supports a curated catalog of Google Fonts plus the system default stack.
  </Accordion>

  <Accordion title="Does the font apply to the email confirmation too?">
    No. Confirmation emails use a standard email-safe font stack. The form font only applies to the form itself.
  </Accordion>

  <Accordion title="Will changing the font affect my form's load time?">
    Minimally. Google Fonts are cached globally across the web. Most respondents will already have popular fonts cached from other websites.
  </Accordion>
</AccordionGroup>