Android Foldable Responsiveness Tester
Test your site on Galaxy Z Fold 6, Pixel Fold, and Z Flip 6 — select a device from the sidebar to open its viewport simulator.
Galaxy Z Fold 6 (Inner)
7.6" Dynamic AMOLED 2X 120Hz
Galaxy Z Fold 6 (Cover)
6.3" Dynamic AMOLED 2X Ultra-Narrow
Google Pixel 9 Pro Fold (Inner)
8.0" Super Actua Flex OLED 120Hz
Google Pixel 9 Pro Fold (Cover)
6.3" Actua OLED 120Hz 20:9
OnePlus Open (Inner)
7.82" Flexi-fluid AMOLED 120Hz
OnePlus Open (Cover)
6.31" Super Fluid AMOLED 120Hz
Google Pixel Fold (Inner)
7.6" OLED 120Hz Landscape Canvas
Galaxy Z Flip 6
6.7" Dynamic AMOLED 2X Clamshell
Motorola Razr+ (2024)
6.9" pOLED 165Hz Super-Tall
Galaxy Z Fold 5 (Inner)
7.6" Dynamic AMOLED 2X 120Hz
Android Foldable Testing FAQs
Best practices for CSS and responsive design on foldable Android devices.
How do Android foldables differ from regular phones for web design?
Foldable devices introduce two viewports: a narrow cover screen (similar to a regular phone) and a wide inner display (similar to a tablet). Web pages must handle both smoothly, including the fold crease or hinge gap.
What CSS media query detects Android foldable dual-screen mode?
Use @media (horizontal-viewport-segments: 2) (modern W3C standard) or the legacy @media (screen-spanning: single-fold-vertical). You can also use env(viewport-segment-*) CSS environment variables to position content relative to fold seams.
What is the difference between Galaxy Z Fold 6 and Pixel Fold viewports?
The Galaxy Z Fold 6 inner display is 768×904px (near-square portrait), while the Pixel Fold inner display is 840×700px (wide landscape). Sites should test both as the aspect ratios are significantly different.