Samsung Galaxy Z Flip8 / Z Fold8 Ultra: Screen Size & CSS Viewport

Samsung's summer foldables arrived on August 7, 2026 in three shapes. The Galaxy Z Flip8 keeps a 6.9″ main display at 2520×1080 pixels, which at a device pixel ratio of 3 gives an estimated CSS viewport of 360×840. The Z Fold8 Ultra pairs a 6.5″ cover screen at 2520×1080 with an 8.0″ inner display at 2256×2504, and the new Z Fold8 introduces a wide 4:3 inner screen at 2448×1848. Cover screens behave like ordinary tall phones at about 412×960; the inner screens are where things get interesting.

The Flip8 at 360px is one of the narrowest modern viewports, so it is the device that exposes overflow first: long words in headings, fixed-width tables and buttons with generous horizontal padding. Its 21:9 shape gives a very tall viewport, which helps above-the-fold content but makes 100vh hero sections look stretched. On the Fold8 Ultra the inner display lands somewhere between 860 and 1130 CSS pixels wide depending on the default density, which means it can fall on either side of the 1024px breakpoint. Until measured values are available, test both 860px and 1128px.

Foldables change size while a page is open. Unfolding fires a resize from a phone width to a tablet width, so avoid layouts that only compute sizes on load, keep carousels and virtual lists responsive to container size, and prefer container queries for components that appear in both states. Check that your site keeps scroll position and form input when the viewport changes.

The 4:3 inner screen of the regular Fold8 is closer to an iPad in landscape than to a phone. Designs that assume foldables are square will look noticeably different there, so add it to your matrix if your analytics show Samsung foldable traffic.