Layered images
The Layered images element combines multiple image layers based on choices or formula data. Use it for a product configurator where color, material, or part choices are combined visually into one image.
Properties
The properties live in the inspector under the Layered images group. The element has two setup modes: table mode and Formula mode.
Property | What it does | Default |
|---|---|---|
Images set-up | Defines the image layers as records or a formula | Empty record list |
Image | Sets the layer image as an asset or a URL (table mode only) | Empty |
Visibility | Controls when the layer is shown (table mode only) | Empty |
Image URL column | Column that supplies the layer image URL (Formula mode only) | Column A |
Visibility formula column | Column that supplies the layer visibility (Formula mode only) | Column A |
The Images set-up property accepts records or a formula. The Image URL column and Visibility formula column fields appear only in Formula mode, and each accepts a column from A to Z. The menu actions are Switch to Table prop, Switch to Formula prop, Add option above, Add option below, and Delete option. The visibility logic is set under Logic.
References
References expose the element's data for use in formulas and other elements.
Result: the selected or rendered image result.
Styling
The Layered images element can be styled per state and per part of the element.
Style states: Active, Default, Disabled, Focus, Hover.
Named targets: wrapper, image.
The default overrides are wrapper relative with aspect-ratio 1 / 1 and overflow hidden, and image absolute with inset 0 and object-fit contain. There is no named built-in style set and no Site quick styles.
An empty configuration shows zero rows; there is no explicit empty-state text.
Related articles
UI Elements: overview of the elements.
FormulaScript Overview: using formulas in properties.