How Safari on visionOS Renders Panoramic and Spatial Photos

This article explains how the Safari web browser on visionOS processes and displays panoramic and spatial photos embedded on webpages. While these media types initially render as standard, flat 2D images within the normal webpage layout, Safari utilizes the HTML Fullscreen API and underlying system frameworks to transform them into immersive, three-dimensional, or wrap-around experiences when activated by the user.

Default Inline Rendering

When a user first loads a webpage in Safari on visionOS, both panoramic and spatial photos embedded via standard HTML <img> or <picture> tags are rendered as flat, two-dimensional images.

Safari intentionally suppresses the 3D and wrap-around effects inside the standard browser window. This preserves the webpage's original layout, ensures text remains readable, and prevents visual discomfort that would occur from scrolling past multiple conflicting depth elements at once. For spatial photos in this inline state, Safari only renders the primary (typically the left-eye) image frame.

Activating the Immersive View

To transition a photo from a flat webpage element into a true spatial or panoramic view, Safari relies on the standard Web Fullscreen API.

Web developers must attach an interaction—such as a tap event—that calls the JavaScript requestFullscreen() method directly on the HTML <img> element. When triggered, Safari extracts the image from the 2D web view and passes it to the native visionOS system renderer. If a user navigates directly to the image file's URL rather than viewing it embedded on a page, Safari automatically provides a native system button to enter this fullscreen mode.

How Spatial Photos are Rendered

Spatial photos are stored in the HEIC (High Efficiency Image Format) container, which holds two separate images—one for the left eye and one for the right eye—alongside spatial metadata that defines disparity and depth.

When a spatial photo enters fullscreen mode in Safari, the following process occurs:

  1. System Handoff: Safari hands the HEIC file off to the visionOS system-level media viewer.
  2. Environment Dimming: The main Safari browser window recedes, and the user's passthrough environment dims slightly to draw focus to the image.
  3. Stereoscopic Projection: The photo floats forward into the user's three-dimensional space. The system renders the left-eye image to the left micro-OLED display and the right-eye image to the right display, creating a sense of true binocular depth.
  4. Window Framing: visionOS applies a soft, feathered border around the edges of the image. This prevents harsh visual cutoffs and comfortably blends the 3D subject matter with the user's physical surroundings.

How Panoramic Photos are Rendered

Panoramic photos are standard 2D image files (such as JPEG, PNG, or HEIC) characterized by an ultra-wide aspect ratio and specific EXIF metadata that indicates the camera's field of view and projection type.

When a panoramic photo is triggered into fullscreen mode, Safari renders it through these steps:

  1. Format Detection: Safari analyzes the image's aspect ratio (typically 2:1 or wider) and reads its EXIF metadata to confirm it is a panorama rather than a standard wide graphic.
  2. Cylindrical Mapping: Instead of displaying the image on a flat plane, visionOS projects the 2D image onto the inside of a massive virtual cylinder or sphere centered around the user's head.
  3. Immersive Presentation: The image expands to fill the user's peripheral vision. Because the rendering is tracked to the Apple Vision Pro's sensors, the user can physically turn their head left and right to look around the scene at scale.