Support foldable devices with the Viewport Segments API

Alexis Menard

Published: June 9, 2025

The Viewport Segments API offers access to the position and dimensions of a logically separate region of the viewport either with JavaScript or CSS, and is available from Chrome 138.

Viewport segments are created when the viewport is split by one or more hardware features—such as a fold or a hinge between separate displays—that act as a divider.

Segments are regions of the viewport that you can treat as logically distinct when developing your site or app. These exciting APIs let you create or optimize your interface specifically for foldable devices. For example, creating a dual pane user-experience, or just avoiding content laying out across the fold.

From the origin trial which we ran last year, there have been two changes:

• The JavaScript attribute segments is now located in the newly added window.viewport object rather than window.visualViewport.
• The segments property behavior when a device is not folded has been aligned with the CSS behavior of this feature. When a device is not folded (or can't be folded), the segments property will contain an array of a single segment representing the whole viewport size.

Check the foldable devices demos to see the API in action!