How Safari on visionOS Dims the Environment for Video

This article explains the technical mechanisms behind how the Safari web browser on Apple's visionOS dims the user's physical surroundings during fullscreen and spatial video playback. By bridging standard web APIs with Apple’s native system compositor and media frameworks, Safari seamlessly lowers the brightness of the real-world passthrough video feed to create a high-contrast, theater-like viewing experience without forcing the user into a fully virtual environment.

Intercepting the Web Fullscreen API

On traditional operating systems like macOS or iOS, clicking the fullscreen button on an HTML5 video player expands the video element to fill the physical display. On visionOS, there is no physical display boundary.

When a user triggers fullscreen mode on a video in Safari, the underlying WebKit engine intercepts the standard JavaScript Fullscreen API request. Instead of merely stretching the Safari window, WebKit hands the video stream over to the native visionOS system media player (AVPlayerViewController). This detaches the video from the standard flat webpage plane and projects it into the user's 3D space as a dedicated media surface.

Communicating with the System Compositor

By default, Safari runs in the visionOS "Shared Space," an environment where multiple apps can exist side by side. For privacy and safety reasons, individual applications in the Shared Space do not have direct access to the camera feeds and cannot arbitrarily manipulate the user's view of the physical room.

To achieve the dimming effect, Safari relies on system-level privileges granted to the native media player. Once WebKit transfers the video to this native player, the player communicates directly with the visionOS system compositor. The compositor is the core rendering engine that blends digital interface elements with the real-time passthrough video feed captured by the headset's external cameras.

Applying the Passthrough Tint

When the system compositor detects that a fullscreen or spatial video has begun playing, it alters the rendering pipeline for the passthrough feed. The compositor applies a global alpha-blended dark tint—effectively reducing the exposure and brightness—exclusively to the real-world camera feed layer.

Because the compositor manages depth and layering, it places this darkening layer behind the virtual video player window. This ensures that the physical room darkens significantly while the video window itself remains at full luminance and color accuracy. The transition is animated smoothly over a fraction of a second to mimic the natural dimming of lights in a movie theater, preventing sudden visual jarring for the user.

Enhancing Spatial Video Playback

When a user watches spatial video in Safari, the dimming mechanism serves a critical optical purpose beyond simple immersion. Spatial videos are encoded in the MV-HEVC format, delivering separate images to each eye to create stereoscopic 3D depth.

In visionOS, spatial videos are presented with soft, feathered edges that act as a window into the 3D scene. If the surrounding physical room is brightly lit, the harsh visual details of the real world conflict with the artificial depth cues of the video, causing eye strain and breaking the 3D illusion. By automatically dimming the passthrough environment, Safari eliminates peripheral visual noise and stabilizes the user's depth perception.

Dynamic State Management

The dimming effect is strictly tied to the active playback state of the media. If the user pauses the video, exits the fullscreen view, or closes the Safari tab, WebKit immediately terminates the native media session. The system compositor responds by smoothly restoring the passthrough camera feed to its standard brightness level, returning the user to their normal mixed-reality workspace.