Sec CH UA Form Factors

Secure context: This feature is available only in secure contexts (HTTPS), in some or all supporting browsers.

Experimental: This is an experimental technology
Check the Browser compatibility table carefully before using this in production.

The HTTP <code>Sec-CH-UA-Form-Factors</code> request header is a user agent client hint which provides information on the user-agent’s device form factor.

Note: The header helps websites understand the device type used by visitors, enabling optimized content delivery.

Syntax

Syntax

Sec-CH-UA-Form-Factors: <form-factor>
Sec-CH-UA-Form-Factors: <form-factor>, …, <form-factor>

Directives

Directives

<form-factor>

A string indicating a common device form factor. All applicable form factors can be included. The meanings of the allowed values are:

"Desktop"

A user-agent running on a personal computer.

"Automotive"

A user-agent embedded in a vehicle, where the user may be responsible for operating the vehicle and have limited ability to interact.

"Mobile"

Small, touch-oriented device typically carried on a user’s person.

"Tablet"

A touch-oriented device larger than "Mobile" and not typically carried on a user’s person.

"XR"

Immersive devices that augment or replace the environment around the user.

"EInk"

A device characterized by slow screen updates and limited or no color resolution.

"Watch"

A mobile device with a tiny screen (typically less than 2 inches), carried in such a way that the user can glance at it quickly.

Examples

A server requests the Sec-CH-UA-Form-Factors header by including the Accept-CH in a response to any request from the client, using the name of the desired header as a token:

HTTP/1.1 200 OK
Accept-CH: Sec-CH-UA-Form-Factors

The client may choose to provide the hint, and add the Sec-CH-UA-Form-Factors header to subsequent requests.
For example, the client might add the header as shown:

GET /my/page HTTP/1.1
Host: example.site

Sec-CH-UA-Mobile: ?0
Sec-CH-UA-Form-Factors: "EInk"

In this case, "EInk" means that the device is characterized by slow screen updates and limited color resolution, and as such, responses may differ depending on this hint.

How to Modify Header using Requestly

Requestly is a user-friendly Chrome extension that lets you modify HTTP headers, including the Sec-CH-UA-Form-Factors header. Changing this header can help you test how your website or application adapts to different device form factors, such as mobile, tablet, or desktop. Steps to Modify Sec-CH-UA-Form-Factors Header:

1. Install and open the Requestly Chrome extension. You can find it on the Chrome Web Store.
2. Create a new rule: Click on “Create Rule” and choose “Modify Headers” from the list of rule types.
3. Add a new header modification:
   • Under “Action”, select “Add” or “Override”.
   • In the “Header Name” field, enter Sec-CH-UA-Form-Factors.
   • In the “Header Value” field, enter the desired form factor values (e.g., “mobile”; “desktop”).
4. Set the URL condition: Specify the URL or pattern where this header change should apply (e.g., https://your-api.com/\*).
5. Save the rule.

By modifying the Sec-CH-UA-Form-Factors header, you can simulate how your site behaves on different device types without needing to switch devices physically. This is helpful for responsive design testing and debugging device-specific issues.