> ## Documentation Index
> Fetch the complete documentation index at: https://docs.qa.tech/llms.txt
> Use this file to discover all available pages before exploring further.

# Test Responsiveness

> Verify layouts across viewports and device types with device presets.

Use device presets when a flow should look and behave correctly on more than one viewport or device profile: phone, tablet, and desktop, or light versus dark mode.

## When to create a responsiveness check

* Marketing and product pages that rearrange at breakpoints
* Checkout or forms that change layout on small screens
* Features that behave differently with dark mode, forced colors, or reduced motion

Create a [device preset](/test-features/device-presets) for each target (for example "iPhone 14", "Galaxy Tab", "Desktop Chrome"), then either:

1. **Separate test plans** — one plan per preset for scheduled or CI runs, or
2. **Per-run override** — pass `devicePresetShortId` on the [Start Run API](/api-reference/runs/start-test-run) without duplicating plans

The [GitHub App](/configuration/github-app) can also pick a preset from PR content when a change mentions responsive design.

## Where to configure details

Viewport size, user agent, geolocation, locale, custom headers, and accessibility emulation live on the [Device Presets](/test-features/device-presets) page. This use case page is only about when to add those presets to your suite.