For the complete documentation index, see llms.txt. This page is also available as Markdown.

Color Connector

Configure dynamic colors for text, shapes, brand themes, fallbacks, and live controls

Use the Color Connector when a shape layer, text layer, or shared color should change dynamically. Typical uses include brand colors, campaign colors, product themes, status colors, and audience-specific visual states.

Studio connector list with color connectors mapped to brand color fields

Options

Option
What it controls
Notes

Target color

The layer color or global HEX value affected by the connector.

Confirm whether the connector should affect one selected layer or every matching color value.

Data source

A Dynamic Data field, Live Control value, edit value, or expression.

Use Live Control for shared brand colors and Dynamic Data for viewer-specific color states.

Edit color

A HEX value entered directly in Studio.

Useful for fixed project colors that may be exposed to Platform editing.

Expression

JavaScript that returns or decides the color.

Use for conditional colors such as correct, incorrect, warning, or success states.

Default or fallback

The color used when the source value is missing or invalid.

Keep fallback colors aligned with the design system.

Platform editing

Whether operators can update the color from Platform.

Enable for values such as brand color or campaign accent color.

Internal description

A note explaining which visual element the color controls.

Important when several layers share similar colors.

Choose Layer or Global Color

Selection
What it affects
Use it when

Layer-based color

The selected layer or selected color property.

Only one layer or a small set of selected layers should change.

Global HEX value

Every project color that uses the same HEX value.

A brand or theme color appears in several places and should change together.

Always preview dynamic colors on the real scene background. A valid color can still fail if it does not provide enough contrast for text, buttons, or important visual states.

Configure a Dynamic Color

1

Select the Color Target

Choose the shape, text color, or global HEX value that should become dynamic.

2

Choose the Source

Select Data, Live Control, Edit, or Expression depending on whether the color is per viewer, shared across the project, fixed, or calculated.

3

Add a Fallback Color

Set a fallback that keeps the design usable if the source field is missing or invalid.

4

Preview Contrast

Check the color against the actual background, nearby media, and any text that depends on it.

Success Checks

Before publishing a Color Connector, confirm:

  • Runtime values use a valid color format such as HEX.

  • The correct layer or global color scope is selected.

  • The fallback color fits the design.

  • Text and important UI states remain readable.

  • Live Control is used for shared operational colors that should be updated centrally.

Data in Studio

Last updated