Make your application forms match your brand with custom colours, backgrounds, and styling options. Create a professional look that represents your community.
Accessing Appearance Settings
Open your template in the editor and click the Appearance tab. Here you'll find all customisation options for your form's visual design.
Screenshot: Appearance settings panel
Colour Scheme
Customise the colours used throughout your form:
| Setting | Where It Applies |
|---|---|
| Primary Colour | Buttons, links, focus states, progress indicators |
| Background Colour | Page background behind the form |
| Form Background | The form card background |
| Text Colour | Labels, descriptions, and body text |
Using Custom Colours
Enter colours in any of these formats:
- Hex codes — #FF5733 or #F53
- RGB values — rgb(255, 87, 51)
- Colour names — coral, navy, forestgreen
Pro Tip
Use your community's brand colours for a cohesive look. If you have brand guidelines, grab your hex codes from there.
Background Options
Choose from several background styles:
Solid Colour
A single flat colour behind your form
Gradient
Smooth transition between two colours
Image
Custom background image with overlay
Pattern
Subtle repeating patterns
Background Images
When using a background image:
- Upload images up to 5MB in size
- Supported formats: JPG, PNG, WebP
- Recommended size: 1920x1080 or larger
- Use the overlay slider to ensure text readability
Accessibility
Always test your form with the background to ensure text is readable. Use the overlay to darken busy images.
Logo & Branding
Add your logo to the form header:
- Click Upload Logo in the Branding section
- Select your logo file (PNG or SVG recommended)
- Adjust the size using the slider
- Position it left, centre, or right
| Setting | Options |
|---|---|
| Logo Size | Small, Medium, Large |
| Position | Left, Centre, Right |
| Show Title | Display template title alongside logo |
Form Card Styling
Customise the appearance of the form container:
- Border Radius — Round the corners from sharp to pill-shaped
- Shadow — Add depth with subtle or dramatic shadows
- Border — Add a visible border around the form
- Padding — Control spacing inside the form
Button Styling
Customise your submit button:
| Option | Description |
|---|---|
| Button Text | Custom text like "Submit Application" or "Apply Now" |
| Button Style | Filled, Outline, or Gradient |
| Full Width | Stretch button across the form |
Preview Your Changes
Use the Preview button to see how your form looks. The preview shows exactly what applicants will see, including:
- All colour and styling changes
- Logo and branding
- Background images/patterns
- Mobile and desktop layouts
Note
Changes are saved automatically as you make them. You can always reset to default styles using the Reset button.
Best Practices
- Keep it readable — Ensure sufficient contrast between text and backgrounds
- Stay on brand — Use consistent colours from your community branding
- Don't overdo it — Subtle styling often looks more professional
- Test on mobile — Check how your styling looks on smaller screens
- Consider dark mode — If your users prefer dark themes, design accordingly