Skip to main content
The Brand Kit lets you match the in-app survey modal to your brand without shipping a new app build. It is project-scoped: every survey in the selected app inherits the kit. Open it from Settings → [your app name] → Brand Kit (?tab=brand). Changes are delivered to the SDK in the survey response and applied on top of the base theme preset, so they take effect on the next survey shown — no app update required.

What you can set

Appearance sits above the tabs — choose Light, Dark, or Auto (follow the device’s system setting). See Dark mode below.
Primary, background, surface, primary text, secondary text, and border. Each colour can be left on Preset, which inherits the value from the SDK theme preset so you only override what you need.Use the Light / Dark switch at the top of the tab to edit each scheme’s palette independently. The dark palette applies in Dark and Auto modes; colours left on Preset there fall back to Insito’s dark defaults.
Click Save Brand Kit to persist; Discard changes reverts to the last saved kit.

Dark mode

The Appearance control decides which scheme a survey renders in: Auto is the recommended default and is pre-selected for newly configured Brand Kits. Existing kits keep their saved value; a kit that was never configured (or predates dark mode) renders Light, so there is no visual change until you opt in. Each scheme has its own colour palette (edited from the Colours tab’s Light / Dark switch). Any dark colour left on Preset uses Insito’s built-in dark defaults. Typography, spacing, radius, and the branding toggle are shared across both schemes.

Previewing your Brand Kit

Brand styling is previewed from the survey builder, so you always see it applied to a real survey. Open any survey and use the Preview button (top-right toolbar) — the preview renders with the project’s saved Brand Kit. A Light / Dark switch above the device frame lets you preview both schemes. For quick access, the survey builder toolbar also has a Brand Kit shortcut (the palette icon, next to Settings and Preview) that opens this panel with the Brand Kit tab already selected. Save your changes, then hit Preview to see them.

Custom fonts

A custom font family only applies if that font is already loaded in your app — for example via expo-font or an equivalent native font link. The SDK does not bundle or load fonts. If the named font is not loaded on the device, React Native silently falls back to the system font.
See SDK theming → Custom fonts for a loading example.

How it combines with code

The SDK layers styling in this order, last wins: base presetBrand Kit (dashboard)init() overrides So anything you set in MicroSurvey.init({ theme }) overrides the Brand Kit for that token. This lets you keep a code-level baseline while still letting non-engineers tweak colours from the dashboard.

Plan gating

The branding toggle is locked below Growth, and the badge is re-applied automatically if a plan is downgraded — no re-save needed.