Product Guides

Branding

Spotlight inherits branding from your Scaleflex project settings. Each experience can override specific style properties while keeping the rest consistent with your brand.

How Branding Works

Branding follows a two-level inheritance model:

Workspace defaults — Pulled from your Filerobot project's public settings API. These define your brand colors, fonts, and logo.
Experience overrides — Each experience can override specific style properties in its config.style object. Unset properties fall back to workspace defaults.

In the builder, style fields that use workspace defaults show a "Using workspace default" hint. Override a value to customize it for that specific experience.

Workspace Settings

View your workspace branding on the Settings → Branding page. These values come from your Filerobot project and are read-only in Spotlight. To change them, update your Filerobot project settings.

Property	Source	Description
Primary color	Filerobot settings	Main brand color. Used for hotspot markers, slider handles, buttons.
Logo	Filerobot settings	Workspace logo displayed in the dashboard header.
Company name	Filerobot settings	Shown in branding badges and embed footers.

Refresh branding

If you've updated your Filerobot settings, click the Refresh button on the Branding page to pull the latest values.

Experience Overrides

In any experience builder, the style panel lets you override:

Property	Applies To	Description
Primary color	All types	Override the workspace primary color for this experience only.
Theme	Hotspot, Tour	Light or dark popover theme for hotspot popovers.
Marker style	Hotspot, Tour	Default marker appearance (dot, numbered, custom).
Handle color	Before/After	Color of the comparison slider handle.

When you clear an override, it reverts to the workspace default. The builder shows which values are overridden vs. inherited.

Branding in Embeds

When an experience is embedded on an external site, the resolved styles (workspace defaults + any overrides) are applied. The embed renderer reads the final merged config and passes it to the JS plugin.

By default, a small "Powered by Scaleflex" badge appears in the bottom corner of embedded experiences. You can disable this in Settings → Embed Defaults.