Make your signup forms feel beautiful, branded, and easy to use.
A well-designed form is key to a successful campaign. Whether you’re collecting email addresses, running surveys, or offering discounts, the way your form looks and feels has a direct impact on conversions.
In this guide, you’ll learn how to customize and style every part of your form using Triggerbee’s visual editor.
Tip! With Brand Settings, you only need to design your Form once, and we will automatically apply your settings to campaigns. However, sometimes it is necessary to fine-tune some settings, and this article describes how to.
What Can You Style?
Triggerbee lets you customize every little detail in your campaign, but in general, you can style:
Text Input fields (email, name, etc.)
Dropdowns and buttons
Consent checkboxes
Radio buttons, date fields, and more
Every input component has its own appearance settings and typography controls, accessible from the right-hand panel when selected.
Step-by-Step: Styling an Input Field
Click the input field (e.g., Email) in your campaign
Open the Style tab in the right-hand panel
Open the Component Appearance accordion:
Background Color – Match your brand or contrast with the background
Border Size & Color – Use subtle borders or none at all for a minimalist look
Rounded Corners – Control corner radius for soft or sharp edges
Padding & Margin – Add spacing inside and around your field
Shadow – Add depth to highlight the field
Typography & Labels
Input fields inherit styling from Brand Settings too, but for fine-tuning:
Label Font & Size – Style field labels like “Email” or “Name”
Placeholder Text – Set the color, size, or remove it entirely
Alignment – Left-align for readability or center-align for compact popups
Buttons and Submit Components
Buttons are fully stylable as well:
Color, Border, Text – Make your call-to-action pop!
Hover effects – Subtle color changes on hover boost interactivity
Icons – Add icons (e.g., mail or arrow) to increase clarity
Alignment and width – Make buttons full-width or inline
Animations: Make your button wiggle, or pop the icon on hoover
Style Presets: Select from a bunch of pre-made styles!
Don't forget to update the “Success” step with a matching button or message style!
Note: There's a difference between a Submit Button, and a Regular Button. Not when it comes to styling, actually, but in general. Regular Buttons are for Call-to-action, navigating and/or closing campaigns - while Submit Buttons are used for submitting Forms.
A submit button is always added when you add an input field.
Consent Checkboxes & Legal Text
Style your Consent fields like any other component:
Make sure that you have linked your privacy policy
Spacing and alignment can be adjusted to keep your form clean
You can choose to hide or show the checkbox depending on your legal requirements
Example Text: “By submitting this form, you agree to our privacy policy”
Use Brand Settings for Consistency
If your workspace has Brand Settings configured, many form styles will be pre-filled:
Typography
Button color and shape
Field sizes
Input appearance
etc.
This ensures your campaigns stay on-brand, even when built by different team members.
Mobile Optimization Tips
Use 100% width fields on mobile for easier tapping
Avoid long multi-line placeholders
Use fewer steps if your form is split across pages
Always preview your form in both Desktop and Mobile views using the preview feature. Simply send the preview link to yourself and open on your phone to check the design.
Best Practices for Form Design
✅ Do | 🚫 Avoid |
Use a clear CTA button (e.g., “Get 10% off”) | Generic CTAs like “Submit” |
Keep fields to a minimum (1–3) | Long, complex forms |
Match the form width to the content size | Oversized empty fields |
Make sure colors meet accessibility contrast ratios | Light grey text on white background |
Align components vertically | Scattered inputs or uneven spacing |