Overview
Default form appearance is managed at the system level via Edit settings in the Receive module. Changes here apply automatically to every published form across your tenant — they're the baseline all forms inherit unless overridden at the template level.
There are three settings that control default appearance, all in the UI section of Edit settings:
Admin access required: These are system-level settings that affect every form across your tenant. Only users with administrator access should make changes here.
How to access the UI settings
- In the Receive module, click Edit settings under Receive settings.
- Scroll to the UI section.
- Click the View link next to the setting you want to update, make your changes, and click Save.
Custom CSS
The Default survey CSS is the master stylesheet applied to every published form. It uses a CSS custom properties (variables) system — you update values in one place and the changes cascade through every component automatically. All variables are scoped to the #surveyWrapper container so they only affect the form interface.
The file is split into two layers. The variables section at the top is where almost all customisation happens — update colour tokens, font families, spacing, and component styles using named variables. The advanced component classes section below applies those variables to specific UI elements. Stick to the variables layer wherever possible; direct class overrides can conflict with future platform updates.
Key variable groups in the file include page and form backgrounds, typography, colour tokens, button styles, form inputs, and individual component settings for checkboxes, radio buttons, progress bars, modals, and more. Every section has comments explaining what it controls.
The file is self-documenting: Each section in the Default survey CSS has inline comments explaining what it controls and how to use it. Reading the comments as you navigate the file is the quickest way to find the variable you need.
Header HTML
The Default survey header HTML injects content into the <head> of every form page before anything else loads. The most common use is adding a <link> tag to load a web font globally — so your brand typeface is available on every form without configuring it in each template individually.
After adding a font link here, update the --cx-font-heading, --cx-font-body, and --cx-font-buttons variables in the Default survey CSS to reference your font family. Loading the font without updating the variables means it loads but never applies.
Template-level header adds to this, not replaces it: If a form template has its own content in the Custom Header field, both load on the page — the default and the template-level content. There's no conflict unless you load the same resource twice.
Logo
There are two separate logo settings that serve different purposes.
Logo url in the System section of Edit settings stores the path to the logo used in the platform admin interface. Update this when your logo image changes.
The logo that appears on published forms is controlled by CSS variables in the Default survey CSS. Find the Logo Source and Size block in the variables section and update the relevant values:
Changes to these settings apply across all published forms as soon as they're saved — no republishing needed. Open a form or use Test Form to confirm everything is rendering correctly after saving.