Data displayApple

Backdrop

Place a token-aware ambient pattern behind native application content.

Public APILumenBackdropApple / SwiftUISwift product: LumenUI

Apple availability

Supported native targets

Import LumenUI in the target that uses this component. iPad support follows the iOS package baseline and uses native iPad layout behavior.

iPhone · iOS 16+iPad · iPadOS 16+Mac · macOS 13+Apple Vision · visionOS 1+

Native example

Use Backdrop

Use behind meaningful hero, empty-state, or highlighted content. Keep child surfaces and text on semantic tokens so contrast does not depend on the decoration.

Backdrop rendered in the iPhone simulator Lumen playground — Verified runtime captureiPhone simulator

LumenBackdrop(
    intensity: .medium,
    variant: .aurora
) {
    ProjectOverview()
}

Reference

Public API

The primary shared and platform-specific options exposed by LumenBackdrop.

API	Values or type	Default	Description
variant	`aurora · dots · grid · rays`	`aurora`	Selects the ambient pattern.
tone	`brand · accent · neutral`	`brand`	Selects the semantic decoration color.
intensity	`subtle · medium · strong`	`medium`	Controls only the decoration opacity.
content	`Native view content`	`Required`	Renders meaningful content above the decorative layer.

Native behavior

Design and accessibility

When to use it

Use behind meaningful hero, empty-state, or highlighted content. Keep child surfaces and text on semantic tokens so contrast does not depend on the decoration.

Accessibility

The ambient layer has no accessibility semantics; child content keeps its native reading order, names, and controls.

Shared component

Available on other platforms

React Native Android / Compose