Customize your Tally form to fit your style or brand seamlessly. With Tally, you can change form colors, fonts, format text, add your logo, and more. Discover how to uplift the design of your forms below.
Customize your form
Customization is available for free and doesn’t require any coding skills. Read on below ↓
Inject custom styles
Fully control the design of your form with custom CSS.
Learn more →
Change colorsApply a theme Create your own custom themeReuse your custom themeChange fontsAdvanced customizationLayoutInputsButtonsInject custom CSSFormat text Add a logoAdd a cover imageUse headingsInsert dividersEdit buttonsCreate columnsInsert imagesActivate the progress barCustomize link preview (OG image, title, description & more)
Change colors
Apply a theme
Click the
Design button above your form title to open the customization options. You can choose between a light and dark theme or create a custom one.
Create your own custom theme
Click
Custom to create your own theme. You can change the color of the form background, text, button, and accents (links, selected options, and focussed inputs) and select a font. To change colors, click on the colored square of one of the options. You can use the color palette to browse colors or type in a HEX code for a particular one.
Reuse your custom theme
If you want to reuse a custom theme, you'll need to save it as a form template first. This allows you to re-apply the same design choices to multiple forms. Themes themselves can't be saved independently yet.
Looking for design inspiration? Check out Happy Hues or UI Colors for different color themes.
Change fonts
You can choose any font from the Google Fonts library (900+ fonts) to use in your Tally forms. Simply select one from the
Font dropdown.
You can upload your own custom font by using custom CSS or code injection.
Advanced customization
Advanced customization is a Tally Pro feature.
Layout
You can change the page width and base font size for your entire form. You can also change the width, height and corner radius of your logo as well as the height of your cover image.
Inputs
You can change the height and width of inputs, or make them full width. You can also change the background, placeholder and border color. Finally, you can also change the border width and radius as well as the bottom margin and horizontal padding.
Buttons
You can change the height and width of buttons, make them full width or automatically adapt the width to your button text. You can change the button text font size and choose between center, left and right alignment. You can also change the background and text color. Finally, you can also change the corner radius as well as the vertical margin and horizontal padding.
Inject custom CSS
Injecting custom CSS codes allows you to fully control the design of your form beyond the default design options. For example, you can change the color of input fields or add a background image.
Click
+ to open the Custom CSS box and paste your code snippets.
Tally will automatically display any design changes in the form builder. If this doesn’t happen, click
Preview.Click here for an overview of all CSS classes and code snippets. Custom CSS is a Tally Pro feature.
Format text
Highlight text to open the formatting options. You can change the text color, add highlight color, make text bold, italic, underlined, or add links. You can find our formatting shortcuts here.
To remove any highlight color and reset it back to default, select the text, open the
Highlight color window, and press the Tx button.
You can inject custom styles to format text beyond the default options.
Pro Add a logo
To add a logo, hover over your form title and click
Add logo. You can upload an image or a link to an image URL.
The recommended logo size is 200x200 pixels.
Add a cover image
Add a cover image by hovering over your form title and selecting
Add cover. You can upload your own image, link to an image URL, select a default color, or choose an image from the Unsplash library. Images from the Unsplash library are royalty-free — you can use them for private and public forms.
The recommended cover image size is a minimum of 1500 pixels wide.
Use headings
Use different sizes of headings to add structure and context to your form. You can pick from three sizes of headings. Type
/heading to see all heading options, or type /h1 , /h2 , or /h3 to instantly add one of the heading sizes. 
Insert dividers
Type
/divider to break up content in your form with a horizontal line. You can drag the line to move it. 
Edit buttons
Hover over your form title and click
Design to edit the button colors. You will need to select the Custom tab to open button design options.
To edit button text, click the
⚙️ icon left of the button.
Create columns
You can display content next to each other by using columns. Click
⋮⋮ and drag and drop form blocks next to each other to create columns.
Insert images
Add images by simply typing
/image. You can upload your own image, link to an image URL, or choose from the Unsplash library. Click on
⋮⋮ left of an image to open image options. These let you hide the image block and add a caption, image link, or Alt text. You can also delete or duplicate the image.
Did you know you can also add images to your multiple-choice options? Click
⋮⋮ to open the block settings to insert images. Scroll down to enable the Image toggle. Then, press Add image and upload your own, link to an image URL, or choose one from the Unsplash image library.
Activate the progress bar
The progress bar provides a clear way for respondents to understand how much of the form they have completed and encourages them to continue until the end. The progress bar only works for multi-page forms.
To enable it, click the
⚙️ icon in the top navigation menu of your form editor to open the Settings page. Navigate to the General section and turn on the Progress bar toggle. Don’t forget to click Save changes.
To avoid confusion for your respondents, we advise you to disable the progress bar if your form contains multiple page jumps.
Customize link preview (OG image, title, description & more)
In the
Share tab of your form, you can customize the Open Graph (OG) image, title, description, site name, and icon—this is what shows up when your form link is shared on social media or messaging apps.Click
Customize to update how your form appears in link previews. You can also choose whether to make your form discoverable by enabling the Allow indexing by search engines checkbox. Customize Link Preview is a Tally Pro feature.
Social media, messaging apps, and search engines may display outdated link previews due to caching, but these should update shortly.
WhatsApp won’t display the OG image if it’s larger than 300 KB. If that happens, try resizing the image to reduce its file size.