Themes and colors

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.

​

Where to find styling settings

Form appearance is configured in the Form Settings Sidebar. You can open it by:

• Clicking the Form style button in the canvas toolbar (left side of the form card)
• Clicking anywhere on the canvas background when no field is selected

The sidebar is organized into sections: Theme, Colors, Typography, Button, Branding, Header Image, and Options.

​

Theme presets

The fastest way to style your form is to pick a theme preset. Filla ships with 12 curated presets — each sets the accent color, font, background, card color, and button style in one click. See Theme presets for the full list and previews.

​

Colors

Filla gives you six color controls. Each accepts a hex code or can be picked from a color wheel.

​

Accent color

The Accent color is the primary interactive color across your form. It controls:

• The submit / next button background
• The progress bar fill
• Selected states on radio cards, checkbox cards, dropdown items, and other interactive elements
• Checkbox and radio indicators (the filled dot or checkmark)
• Links in text blocks
• Selected badges in multi-select dropdown fields

The default accent color is #4573d2.

​

Page background color

The Page background color controls the area behind the form card — the full viewport background that respondents see. On a default form, this is a light gray (hsl(var(--muted))). Set it to any color to match your brand.

​

Card background color

The Card background controls the form card itself — the white container that holds your fields. Change it for dark themes or branded looks.

​

Question text color

The Question text color applies to field labels, field descriptions, section group titles, text block content, and input placeholder text. Use this when your card background is dark and the default text color would be unreadable.

​

Answer text color

The Answer text color applies to text that respondents type into inputs, textareas, and select fields. This is typically darker than question text for readability.

​

Button text color

The Button text color sets the text inside the submit / next button. The default is white (#ffffff). Change this when your accent color is light and white text would be hard to read.

​

Typography

​

Font family

Choose a Google Font for your form from a curated catalog. The font applies to all text: titles, labels, descriptions, inputs, and buttons. Available fonts include Inter, DM Sans, Plus Jakarta Sans, Poppins, Outfit, Space Grotesk, Manrope, Quicksand, and more. Select System default to use the browser’s native font stack. See Fonts for the complete list and guidance on choosing a font.

​

Button

​

Button shape

The Button Shape controls the corner radius of the submit / next button. Choose from three options: The button style selector shows a live preview of each option using your current accent and button text colors.

​

Submit button label

The Submit button label setting lets you customize the text on the submit button. It defaults to “Submit” but you can change it to anything — “Send”, “Apply now”, “Place order”, etc. The submit button label supports variable text, so you can use dynamic references like Submit for @{Company Name}.

​

Logo

Upload a Logo image to display your brand at the top of the form. The logo appears as a circular badge above the form content. Recommended: Use a PNG or SVG with a transparent background. Keep logos under 200px tall for a clean appearance.

​

Header image

The Header image adds a visual image to your form. Control where it appears using the Header image position selector.

​

Header image positions

​

Options

​

Progress bar

The Progress bar toggle controls whether a thin colored bar appears at the top of multi-page forms. It fills based on page progress and uses your accent color. Disable it for single-page forms or when you want a cleaner look.

​

Hide Filla branding

The Hide Filla branding toggle removes the “Built with Filla” footer from the bottom of your form.

​

Favicon

Upload a Favicon to change the browser tab icon when respondents have your form open. See Favicon for requirements and details.

​

Building a dark theme

To create a dark-themed form:

​

Child form theme inheritance

Child forms (used in linked record fields) automatically inherit the parent form’s theme. Colors, font, button style, and card background all carry over. You do not need to style child forms separately. When you update the parent form’s appearance, all child forms reflect the changes immediately — both in the editor and on the public form.

​

Appearance settings reference

​

Common questions