In Formaloo, form design is now powered by themes – reusable design presets that control how your form looks and behaves.
Instead of styling each form from scratch, every form is connected to a theme. This means your design settings (colors, layout, fonts, and more) are managed through that theme and can be reused or updated across multiple forms.
In this guide, we’ll walk you through all the available design settings and how to customize them to match your needs.
How to access and edit your form design
When you open the Design tab in the form editor, you’ll first land in the theme management section – this is where you manage the theme applied to your form, or edit it further:
From here, you can:
See the currently applied theme
Switch to one of your existing workspace themes
Choose a ready-made system theme from the gallery
Or create a new theme from scratch
Once a theme is selected, you can edit it from under the ••• menu – this is where you’ll customize colors, layout, fonts, and other settings covered in this guide.
If the theme is already applied to multiple forms, you’ll see a warning before making changes. You can then choose to:
Continue editing – the changes will apply to all forms using this theme
Duplicate the theme and edit the copy instead – to create a theme variation while keeping the original untouched
ℹ️ If you’re new to themes, check out our guide on creating and reusing design themes across forms
⚠️ If your form was created before themes were introduced, you may be asked to:
Convert your existing design into a theme
Pick and assign an existing theme
To continue editing the design, you’ll need to proceed with one of these options.
Choose your form type
At the top of the Design tab, you’ll see two options for your form type:
Classic form
All questions appear on one page, or multiple pages created with pagination
One question at a time
Questions are shown one per page (multi-step)
You can switch between these two at any time based on the flow you'd like your respondents to have.
💡 Need multi-page form but with multiple fields per page?
To create a paginated form where each page has a set of questions – pick the Classic form type, and add New pages as needed from the list of fields.
Drag and drop the form fields to move them between the form's pages:
Pick a layout
Right below the form type, you’ll find layout options that let you change the visual structure of your form:
Select the arrangement that best matches your brand or use case.
Adjust form width and field spacing
Once you’ve chosen your layout, you can fine-tune how spacious or compact your form feels.
👉 Form width
You can control how wide your form appears on the page. By default, the form width is set to 50%, but you can:
Decrease it for a more compact, centered look
Increase it up to full width for a more immersive layout
Reset it back to the default at any time
Adjusting the width helps you match your form to your design style – whether you prefer a narrow, focused experience or a full-width layout.
👉 Field spacing
You can also control the spacing between your fields to improve readability and layout.
ℹ️ Field spacing settings (vertical and horizontal) are only available in Classic forms. Since One-question-at-a-time forms display a single field per page, spacing between fields is not applicable and won’t be shown.
Vertical spacing controls the space between fields stacked on top of each other
Horizontal spacing controls the space between fields placed side by side
💡 Horizontal spacing can be especially useful when using multi-column layouts, helping you balance density and clarity.
💡 Want to explore these settings in more detail?
Check out our guide on adjusting form width and field spacing in Formaloo
Customize colors (Color palette)
In Color palette, you can change colors for the main parts of your form:
Questions and texts
Answers
Fields background (can be synced with answers color)
Buttons
Button text
Background
You can select colors by clicking on the drop icon and either select colors randomly from the color wheel or put in color codes under #HEX.
This allows you to match colors according to your brand's color palette:
💡 If you want to change the color of a specific field description, click inside the description text and use the formatting toolbar to update its color. This is helpful for highlighting important instructions under a question without changing your overall theme:
If you'd like to learn in detail about customizing texts, read the article on how to add and customize the text in your form.
Choose a font + font size
In Fonts, choose a Font from the dropdown. Your selection applies across the entire form, keeping the experience consistent.
The default font is Inter, but you can browse the list and pick a style that better matches your brand’s tone and look.
You can also adjust the Font size across the whole form, choosing between small, medium, and large depending on the level of readability and visual emphasis you want to achieve:
Add logo, cover image, and background image
You can enhance your form’s design by adding branded visuals – including a logo, cover image, and background image – as part of your theme.
These elements help create a more polished, on-brand experience for your respondents. Upload the images using drag and drop or the file picker:
When added to a theme, these visuals are automatically applied to any new form using that theme, helping you maintain consistency across your workspace.
👉 For the background image, you can also tweak the focal point, and adjust the brightness to make sure your questions and inputs stay readable:
If the background makes the form hard to read, increase brightness or use a simpler image with less detail.
💡 You can also upload a logo or cover image directly inside the form editor:
They'll be added as default visuals in your theme's settings or will replace the previously existing ones.
ℹ️ Cover images in 1QAT forms:
In one-question-at-a-time forms, you can set an individual cover image for each page. If no page-specific image is added, the form will fall back to the default cover image from your theme.
⚠️ Keep images lightweight
Large image files may slow down loading, especially on mobile. For the best performance, make sure your images are optimized (resized or compressed) before uploading.
Adjust corner roundness
All small details matter, so we also made it possible for you to adjust button corner roundness. You can choose from 3 options. The decision will apply to all buttons in the survey/form:
Customize your form's SEO & Meta tags
You can also adjust how your form appears when shared or discovered online. In the SEO & Meta tags, you can control how your form link appears on search engines and social media platforms by:
Uploading a favicon for your form
Uploading a meta image that will be shown as a preview when the form link is shared:
Use Advanced settings
In the Advanced section, you can control what respondents see and how the form behaves. Some options are available in both form types, and some only appear in One question at a time.
Advanced options can change based on form type, If you switch between Classic form and One question at a time, you may notice that some toggles appear or disappear. That is expected.
👉 Advanced settings in Classic form
When your form type is Classic form, you will typically see:
Show progress bar
Can be enabled in forms with more than one page.
Show form title
Make fields full width
With this toggle on, your form fields will expand to the full width of the form container, ideal for modern, minimal layouts or mobile-friendly designs.
👉 Extra options in One question at a time
When you choose One question at a time, you may also see:
Show welcome page
You can choose to show or hide the title and description on the first page, when disabled, the form jumps directly to the first question.
Show form progress bar
Shows a progress indicator as respondents move through the form step by step, so they know how far they are from finishing.
These options help guide respondents through a step-by-step flow and make longer forms feel easier to complete.
💡 If your form is set to One question at a time, you can choose whether to show the Welcome page. This is the first screen respondents see, and it can display your form’s title and description before they start answering.
In Classic form, the main option is Show form title, which lets you hide the default title shown at the top of the form. Many teams use this to keep an internal name for the form, while showing a custom title inside the form using Description or Content field instead.
⭐ Add custom CSS (optional)
In Custom code, you can add Custom CSS to style the form beyond the Design settings:
💡 We have gathered all CSS selectors supported in Formaloo for you to add your styles. Recently, we've also introduced the option to target individual form fields via field IDs with custom CSS.
👀 If you aren't confident with CSS, feel free to check out the most frequently used custom CSS examples for beginner-friendly instructions and inspo.