Branding controls how your cancel experience looks to your customers — the colors, fonts, logo, shape, and layout of both the in-app cancellation widget and the hosted cancel page. It is set once per workspace and applies to every flow you run. This article covers each setting on the Design screen, the Widget and Page tabs, and saving, resetting, and who can make changes.
Where to find Design
Open Flows in the sidebar, then choose Design. The screen opens with two tabs at the top:
Widget — styles the in-app cancellation pop-up that intercepts cancellations inside your product.
Page — styles the hosted cancel page customers reach via a link.
Each tab shows your editing controls on the left and a live preview on the right that updates as you change settings. Switching tabs while you have unsaved changes prompts you to keep editing or discard them.
💡 One look, every flow
Branding is saved at the workspace level. You don't style each flow individually — your saved Widget and Page designs apply to all of your flows automatically.
Step 1: Design the widget
On the Widget tab the controls are grouped into collapsible sections:
Shape & layout
Styling — pick Classic (step indicators, compact) or Minimal (single progress bar, airy).
Border radius — corner rounding of the widget, from 0px (sharp) to 32px (rounded).
Button radius — corner rounding of buttons, from 0px (square) to 24px (pill).
Header — three toggles that control what shows at the top of the flow:
Step labels — shows labels such as Survey, Special Offer, and Feedback above each heading.
Progress indicator — shows a progress bar at the top of the flow.
Close button — shows the X button in the top-right corner.
Branding
Company logo — upload your logo (optional). Set its alignment to Left or Center and adjust its height with the Logo height slider; width scales proportionally.
Business name — optional text shown beside the logo.
Accent color — your primary brand color, used for buttons and highlights.
Colors — fine-tune individual surfaces: Background, Headline color, Subheading color, Card background, Divider color, and Offer card color.
Typography — choose a Headline font and Body font from the font list, and set Headline size and Body text size.
Advanced — turn on Confetti on offer accepted for a short celebration animation when a customer accepts an offer and stays.
Step 2: Design the cancel page
The Page tab styles your hosted cancel page. The controls mirror the widget, with a few page-specific options:
Shape & layout — pick Classic (cards, banners and social proof) or Minimal (clean, distraction-free), then set the Button radius and Card radius.
Branding — set the Accent color, upload a Company logo (with alignment and height), and add an optional Business name.
Colors — control Page background, Header background, Headline color, Subheading color, Card background, and Divider color.
Typography — choose Headline font and Body font, and set Headline size and Body text size.
💡 Accent color is inherited once
The first time you open the Page tab, it borrows the accent color from your widget design as a starting point. After that, the page accent color is independent — the two are saved separately, so editing one never overwrites the other.
About logo uploads
Logos are uploaded directly from the Design screen. Supported formats are SVG, PNG, JPEG, and WEBP, with a maximum file size of 200 KB. To remove a logo, use the X next to the uploaded file.
⚠️ SVG logos must be clean
For security, SVG files that contain scripts, event handlers, or external references are rejected. If your SVG won't upload, re-export it without those elements, or use a PNG instead.
Step 3: Preview, save, or reset
The preview on the right reflects your changes immediately, but nothing goes live until you save.
Make your changes — the preview updates as you go.
Click Save design to publish. This button is only active when you have unsaved changes.
To start over, click Reset. This reverts every setting on the current tab back to its default. You still need to click Save design afterward for the reset to take effect.
If you try to leave the screen or switch tabs with unsaved changes, you'll see an Unsaved changes prompt where you can choose Keep editing or Discard changes.
⚠️ Save the Widget and Page tabs separately
Each tab is saved on its own. Saving the Widget tab does not save the Page tab, and vice versa. If you edit both, click Save design on each tab before leaving.
Who can edit branding
Editing branding requires an Owner, Admin, or Member role. If you have a view-only role, you'll see the design and live preview with a View only banner, and the editing controls and Save design button are hidden.