Form Styling & Themes – Customize Your Form | Uplup
Make your forms match your brand with Uplup’s extensive styling options. Choose from 25+ pre-built themes or customize every visual element including colors, fonts, backgrounds, and buttons.
Table of Contents
- Accessing Design Settings
- Theme Presets
- Color Customization
- Typography Settings
- Background Options
- Button Styling
- Field Appearance
- Layout Options
Accessing Design Settings
To customize your form’s appearance:
- Open your form in the builder
- Click the “Design” tab in the top navigation
- The design panel shows all styling options organized into tabs
- What to capture: The Design tab with theme presets and customization options.
- Show: Theme gallery at top, and tabs for Text, Fields, Form, Finish Page.
Theme Presets
Uplup includes 25+ professionally designed themes. Click any theme to instantly apply its complete style – colors, fonts, and backgrounds all change at once.
Theme Categories
- Minimal – Clean, distraction-free designs
- Modern – Contemporary, professional looks
- Bold & Vibrant – Eye-catching, colorful themes
- Dark Themes – Dark backgrounds with light text
- Corporate – Professional, business-appropriate
- Playful – Fun, engaging designs
- Nature Inspired – Earthy, organic colors
Using Themes as Starting Points
Select a theme that’s close to what you want, then customize individual settings. Your customizations override the theme defaults.
Color Customization
Fine-tune every color to match your brand.
Primary/Accent Color
The main brand color used for buttons, highlights, progress bars, and interactive elements.
Text Colors
- Heading Color – Color for section headings
- Body Text Color – Color for labels and descriptions
- Link Color – Color for clickable links
- Error Color – Color for validation error messages
Background Colors
- Form Background – Main form container background
- Field Background – Input field background
- Page Background – Background behind the form
- What to capture: The color customization section.
- Show: Color pickers for primary color, text colors, and backgrounds.
Typography Settings
Control fonts and text styling throughout your form.
Font Family
Choose from 150+ Google Fonts including:
- Sans-serif: Inter, Open Sans, Roboto, Lato, Poppins
- Serif: Georgia, Playfair Display, Merriweather
- Display: Montserrat, Raleway, Oswald
Font Sizes
- Heading Size – Size for section titles (10px – 72px)
- Body Size – Size for descriptions and labels (10px – 32px)
Font Weights
- Light (300)
- Normal (400)
- Bold (700)
Background Options
Set the background behind your form for visual impact.
Solid Color
Simple single-color background. Works well for embedded forms.
Image Background
Upload a custom image as the landing page background. Drag and drop to upload.
Split Layout
Display an image panel alongside your form:
- Image position: Left or Right
- Split ratio: 40/60, 50/50, or 60/40
Button Styling
Customize submit and navigation buttons.
Button Colors
- Background Color – Button fill color
- Text Color – Button label color
- Border Color – Button border (if applicable)
Button Shape
- Square – Sharp corners
- Rounded – Slightly rounded corners
- Pill – Fully rounded ends
Button Size
- XS – Extra small (12px font)
- Small – Compact (14px font)
- Medium – Standard size (16px font)
- Large – Prominent (18px font)
- XL – Extra large (20px font)
Button Alignment
- Left, Center, or Right alignment
Enter Key Hint
- Show “Enter ↵” hint – Toggle to show or hide the keyboard shortcut hint that appears next to submit/continue buttons. Disable this for a cleaner button appearance.
Field Appearance
Style the input fields themselves.
Field Border
- Border Width – None, Thin, Medium, or Thick
- Border Color – Color of field borders
- Border Radius – Roundness of corners (0-50px)
Field Sizing
- Size: Small, Medium, or Large
- Shape: Square, Rounded, or Pill
Checkbox & Radio Styling
Customize the accent color for checkboxes and radio buttons to match your brand.
Layout Options
Form Width
Control the maximum width of your form (300px – 1600px, or 100% full width). Default: 700px.
Layout Types
- Seamless – Borderless, transparent background
- Container – Bordered form with shadow
- Split Layout – Form with side image panel
Spacing
- Form Padding – Space inside form container (0-100px)
- Question Label Spacing – Gap below labels
Tips for Great Form Design
- Match your brand – Use your brand colors and fonts for consistency
- Ensure readability – High contrast between text and background
- Keep it simple – Clean forms convert better
- Test on mobile – Preview your form on different screen sizes