Rolling theme updates

Use this when your app is going through a rebrand and the widget theme should change at the same time as your own release.

Instead of switching the default theme for everyone, assign the new theme to a runtime feature flag. People who open a flow with that flag see the new theme. Everyone else keeps seeing your default theme.

This works for hosted pages, iframe embeds, and SDK-loaded widgets.

1. Create the new theme

Open Settings → Theme and create or edit the theme you want to roll out. Keep your current production theme as the default until the release is ready.

2. Assign the theme to a flag

On the theme you want to roll out, open the actions menu and choose Rolling release. Enter the feature flag name and value your app will send at runtime.

For a simple on/off flag:

For a variant flag, use the variant value your app already uses, such as treatment or new_brand.

After you save, the theme card is marked Rolling. Its actions menu shows the flag that controls the rollout.

3. Send the flag at runtime

Send the flag when your app is in the matching release state.

For hosted pages and iframe embeds, add the flag to the URL.

Hosted page:

https://getuserfeedback.com/s/SURVEY_ID/flag:rebrand_v2

Iframe:

https://getuserfeedback.com/embed/YOUR_API_KEY/SURVEY_ID/flag:rebrand_v2

If your flag has a variant value, include it after the flag name:

https://getuserfeedback.com/embed/YOUR_API_KEY/SURVEY_ID/flag:brand_rollout:treatment

Replace rebrand_v2, brand_rollout, and treatment with your own flag names and values. The examples are arbitrary — use the same feature flag names your app already uses for the rollout.

For the JavaScript SDK, pass the flag when you create the client:

import { createClient } from "@getuserfeedback/sdk";const client = createClient({apiKey: "YOUR_API_KEY",flags: { rebrand_v2: true },});

For a variant flag:

const client = createClient({apiKey: "YOUR_API_KEY",flags: { brand_rollout: "treatment" },});

For React, pass the same flags option through clientOptions:

<GetUserFeedbackProviderclientOptions={{apiKey: "YOUR_API_KEY",flags: { rebrand_v2: true },}}><App /></GetUserFeedbackProvider>

Pass SDK flags before the widget loads. The widget uses them when resolving the theme for both automatically assigned flows and flows you open from code.

What good looks like

• Your app and the widget switch visual design in the same release.
• The default theme still protects people who are not in the rollout.
• The same flag works for hosted pages, iframe embeds, and SDK-loaded widgets.

Managing the rollout

Open the rolling theme's actions menu when you're ready to change state.

• Choose Promote to everyone to make the rolling theme your default theme.
• Choose Stop rollout to remove the flag assignment and return those people to the default theme.

What can break

If the flag is missing from the URL or SDK client options, the default theme is used. If the flag name or value does not match the theme assignment, the default theme is used.

For the full URL format, see Hosted pages or Iframe. For SDK options, see JavaScript SDK reference or React SDK reference.