> ## 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.

# Theme presets

> Apply a curated theme in one click — colors, font, and button style all set at once.

## How presets work

A theme preset is a bundle of appearance settings applied in one click. Each preset sets:

* **Accent color** — buttons and progress bar
* **Page background color** — the viewport behind the card
* **Card background color** — the form card itself
* **Question text color** — labels and titles
* **Answer text color** — input text
* **Button text color** — submit button text
* **Button style** — square, rounded, or pill
* **Font family** — a Google Font

Presets do **not** change your logo, favicon, header image, or progress bar toggle. Those stay as you configured them.

## Applying a preset

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

  <Step title="Find the Theme section">
    The **Theme** section is at the top of the sidebar, above Colors.
  </Step>

  <Step title="Click a preset">
    Each preset shows a 3-color swatch preview. Click one to apply it instantly.
  </Step>
</Steps>

After applying a preset, you can adjust any individual setting in the Colors, Typography, or Button sections below.

## Available presets

| Preset       | Accent           | Font              | Background             | Feel                   |
| ------------ | ---------------- | ----------------- | ---------------------- | ---------------------- |
| **Default**  | Blue `#4573d2`   | System default    | Light gray             | Clean, neutral         |
| **Midnight** | Indigo `#818cf8` | Inter             | Dark navy `#0f172a`    | Dark, modern           |
| **Ocean**    | Green `#059669`  | DM Sans           | Mint `#ecfdf5`         | Fresh, natural         |
| **Sunset**   | Orange `#ea580c` | Plus Jakarta Sans | Peach `#fff7ed`        | Warm, inviting         |
| **Lavender** | Purple `#9333ea` | Poppins           | Light purple `#faf5ff` | Soft, creative         |
| **Slate**    | Gray `#475569`   | IBM Plex Sans     | Cool gray `#f8fafc`    | Minimal, corporate     |
| **Coral**    | Pink `#e11d48`   | Outfit            | Light pink `#fff1f2`   | Bold, vibrant          |
| **Forest**   | Green `#4ade80`  | Space Grotesk     | Dark green `#14532d`   | Dark, organic          |
| **Warm**     | Gold `#ca8a04`   | Nunito            | Light yellow `#fefce8` | Friendly, approachable |
| **Minimal**  | Black `#171717`  | Inter             | White `#ffffff`        | Ultra-clean            |
| **Sky**      | Blue `#0284c7`   | Manrope           | Light blue `#f0f9ff`   | Calm, trustworthy      |
| **Rosé**     | Pink `#db2777`   | Quicksand         | Light rose `#fdf2f8`   | Elegant, feminine      |

## Dark presets

**Midnight** and **Forest** are dark themes with dark backgrounds and light text. They work well for:

* Tech products and developer tools
* Evening events and nightlife
* Portfolio and creative showcases
* Any brand with a dark color palette

<Warning>
  When using a dark theme, make sure your header image and logo work on a dark background. A logo with a white or transparent background works best.
</Warning>

## Common questions

<AccordionGroup>
  <Accordion title="Can I create my own preset?">
    Not yet. You can manually configure all appearance settings to create a custom look, but saving it as a reusable preset is not currently supported.
  </Accordion>

  <Accordion title="Do presets work on existing forms?">
    Yes. You can apply a preset to any form at any time. It will update the appearance immediately.
  </Accordion>

  <Accordion title="Will applying a preset overwrite my current colors?">
    Yes. A preset replaces your accent, background, card, text colors, font, and button style. It does not touch your logo, favicon, header image, or other settings.
  </Accordion>
</AccordionGroup>