iPhone Duo Chrome DevTools Profiles

Unofficial Chrome DevTools custom-device profiles for testing Duo Outer and Duo Inner responsive layouts.

Designed for designers, developers, QA teams and anyone who needs to preview, capture screenshots, record videos or test responsive behaviour without having the physical device available.

Included profiles

Important: These are unofficial Chrome DevTools testing presets. The profiles do not emulate physical Apple hardware, Safari/WebKit, hinges, cut-outs or device-specific safe areas.

---

Why these profiles exist

Chrome DevTools uses CSS pixels for responsive viewport dimensions.

Entering a physical Retina resolution directly into Chrome DevTools can result in a website treating the viewport as an extremely large desktop display.

For example, entering:

2853 × 2007

directly as the browser viewport can cause:

• extremely small navigation
• tiny cards
• incorrect responsive breakpoints
• desktop layouts instead of tablet layouts
• unrealistic screenshots

The correct approach is to use the CSS viewport together with the Device Pixel Ratio.

Duo Outer

CSS viewport:
466 × 678

Device Pixel Ratio:
3

466 × 3 = 1398
678 × 3 = 2034

Duo Inner

CSS viewport:
951 × 669

Device Pixel Ratio:
3

951 × 3 = 2853
669 × 3 = 2007

This allows Chrome to render the website using a realistic responsive viewport while retaining the intended high-density output relationship.

---

Repository contents

iphone-duo-chrome-devtools-profiles/
│
├── README.md
├── LICENSE
├── CHANGELOG.md
├── .gitignore
│
├── INSTALL_WINDOWS.bat
├── DOCTOR_WINDOWS.bat
├── install_macos_linux.sh
│
├── docs/
│   └── MANUAL_SETUP.md
│
├── profiles/
│   ├── iphone-duo-devtools.json
│   └── reference.json
│
└── tools/
    └── duo_profiles.py

---

Windows Installation

Step 1 — Download the repository

Click:

Code → Download ZIP

Extract the ZIP.

The extracted folder will usually be named:

iphone-duo-chrome-devtools-profiles-main

---

Step 2 — Find the Chrome profile

Before closing Chrome, open:

chrome://version/

Find:

Profile Path

Example:

C:\Users\YourName\AppData\Local\Google\Chrome\User Data\Default

The final folder identifies the Chrome profile.

Examples:

Default
Profile 1
Profile 2
Profile 3

Also note the:

Google Chrome version

The Chrome version is useful when troubleshooting because Chrome's internal DevTools configuration can change between releases.

---

Step 3 — Fully close Chrome

This step is important.

Closing the Chrome window may not completely close Chrome because background processes can remain active.

The installer changes Chrome's profile Preferences file. An active Chrome process can overwrite that file.

Recommended method

Open:

Task Manager

Find every:

chrome.exe

process and choose:

End task

Alternatively, open Command Prompt and run:

taskkill /F /IM chrome.exe

To verify that Chrome is no longer running:

tasklist | findstr /I chrome.exe

If no result appears, Chrome is fully closed.

---

Step 4 — Run the installer

Inside the extracted repository folder, double-click:

INSTALL_WINDOWS.bat

If multiple Chrome profiles exist, the installer may display:

Chrome profiles found:

1. Default
2. Profile 1
3. Profile 2
4. Profile 3

Choose the profile matching the Profile Path found earlier at:

chrome://version/

Example:

C:\Users\YourName\AppData\Local\Google\Chrome\User Data\Default

means:

Choose: Default

---

Windows permission issue

If the installer cannot update the Chrome Preferences file, right-click:

INSTALL_WINDOWS.bat

and select:

Run as administrator

Administrator mode should only be necessary when Windows permissions block access to the Chrome profile.

---

Step 5 — Verify the Windows installation

Reopen Google Chrome.

Open DevTools:

F12

Open DevTools Settings:

F1

Then go to:

Settings → Devices

The following custom devices should now appear:

iPhone Duo Outer
iPhone Duo Inner

Make sure both devices are enabled.

---

Step 6 — Open Device Toolbar

Use:

Ctrl + Shift + M

Select:

iPhone Duo Outer

or:

iPhone Duo Inner

Reload the website after switching profiles.

---

Expected Windows profiles

iPhone Duo Outer

Width:
466

Height:
678

DPR:
3

Device type:
Mobile

iPhone Duo Inner

Width:
951

Height:
669

DPR:
3

Device type:
Desktop (touch)

Recommended orientation:
Landscape

---

Windows Troubleshooting

If the installer says:

Added: 2

but the profiles do not appear in Chrome, check the following.

Confirm Chrome Profile Path

Open:

chrome://version/

Check that the selected installer profile matches:

Profile Path

Completely terminate Chrome

Run:

taskkill /F /IM chrome.exe

Then rerun:

INSTALL_WINDOWS.bat

Run as administrator

If Windows permissions are blocking the Preferences file:

Right-click INSTALL_WINDOWS.bat
→ Run as administrator

Check Devices directly

Open:

F12
→ Settings
→ Devices

Check this page before checking the Device Toolbar dropdown.

---

Windows Diagnostic Tool

A diagnostic helper is included:

DOCTOR_WINDOWS.bat

Use this only when something is not working.

The diagnostic tool checks:

Chrome running state
Chrome profile
Chrome Preferences path
Duo profile presence
Custom-device data
Configuration validity

The diagnostic tool does not install additional software.

---

Windows Chrome profile paths

Typical Chrome profile root:

C:\Users\YourName\AppData\Local\Google\Chrome\User Data\

Default profile:

C:\Users\YourName\AppData\Local\Google\Chrome\User Data\Default

Preferences file:

C:\Users\YourName\AppData\Local\Google\Chrome\User Data\Default\Preferences

Additional profiles:

C:\Users\YourName\AppData\Local\Google\Chrome\User Data\Profile 1\Preferences

C:\Users\YourName\AppData\Local\Google\Chrome\User Data\Profile 2\Preferences

The installer modifies the selected Chrome profile only.

---

macOS Installation

Step 1 — Download the repository

From GitHub select:

Code → Download ZIP

The ZIP will normally download into:

Downloads

After extraction, GitHub usually names the folder:

iphone-duo-chrome-devtools-profiles-main

---

Step 2 — Find the Chrome profile

Before closing Chrome, open:

chrome://version/

Find:

Profile Path

Example:

/Users/YourName/Library/Application Support/Google/Chrome/Default

The final folder identifies the Chrome profile:

Default
Profile 1
Profile 2
...

Also note the:

Google Chrome version

---

Step 3 — Open Terminal

Open:

Applications
→ Utilities
→ Terminal

Then run:

cd ~/Downloads

Check the Downloads folder:

ls

Look for:

iphone-duo-chrome-devtools-profiles-main

---

Step 4 — Enter the repository folder

Run:

cd iphone-duo-chrome-devtools-profiles-main

Then:

ls

The output should contain files such as:

README.md
install_macos_linux.sh
tools
profiles
docs

---

Step 5 — Allow the installer to run

Run:

chmod +x install_macos_linux.sh

---

Step 6 — Fully close Google Chrome

Run:

pkill -x "Google Chrome"

Nothing appearing afterward is normal.

This command ensures that Chrome and remaining background Chrome processes are closed before the Preferences file is changed.

---

Step 7 — Run the Mac installer

Run:

./install_macos_linux.sh

The complete command sequence is:

cd ~/Downloads
ls
cd iphone-duo-chrome-devtools-profiles-main
ls
chmod +x install_macos_linux.sh
pkill -x "Google Chrome"
./install_macos_linux.sh

---

If the downloaded folder has a different name

Use:

ls

and copy the exact folder name.

For example:

iphone-duo-chrome-devtools-profiles-main-2

would require:

cd iphone-duo-chrome-devtools-profiles-main-2

---

macOS permission error

If macOS returns:

Permission denied

run:

bash install_macos_linux.sh

instead.

---

Step 8 — Choose the correct Chrome profile

If multiple profiles are detected, choose the profile matching the path found earlier at:

chrome://version/

Example:

/Users/YourName/Library/Application Support/Google/Chrome/Default

means:

Default

---

Step 9 — Verify the Mac installation

Reopen Google Chrome.

Open DevTools:

⌘ Command + ⌥ Option + I

Open Device Toolbar:

⌘ Command + Shift + M

Open DevTools Settings:

F1

Then go to:

Settings → Devices

The following custom devices should appear:

iPhone Duo Outer
iPhone Duo Inner

---

macOS Chrome profile paths

Typical Chrome profile root:

~/Library/Application Support/Google/Chrome/

Default profile:

~/Library/Application Support/Google/Chrome/Default

Preferences file:

~/Library/Application Support/Google/Chrome/Default/Preferences

Additional profiles:

~/Library/Application Support/Google/Chrome/Profile 1/Preferences

~/Library/Application Support/Google/Chrome/Profile 2/Preferences

---

macOS Troubleshooting

If the profiles do not appear:

Fully close Chrome again:

pkill -x "Google Chrome"

Return to the repository:

cd ~/Downloads/iphone-duo-chrome-devtools-profiles-main

Run the installer again:

./install_macos_linux.sh

If direct execution fails:

bash install_macos_linux.sh

Then reopen Chrome and check:

DevTools
→ Settings
→ Devices

---

Manual Installation

If automatic installation does not work on a particular Chrome version, both profiles can be created manually.

Open:

Chrome DevTools
→ Settings
→ Devices
→ Add custom device

---

Manual — iPhone Duo Outer

Enter:

Device:
iPhone Duo Outer

Width:
466

Height:
678

Device Pixel Ratio:
3

Device Type:
Mobile

Recommended form factor:

Mobile

---

Manual — iPhone Duo Inner

Enter:

Device:
iPhone Duo Inner

Width:
951

Height:
669

Device Pixel Ratio:
3

Device Type:
Desktop (touch)

Recommended form factor:

Tablet

Recommended orientation:

Landscape

---

Optional Client Hint settings

The following fields can normally remain empty:

Full browser version
Platform
Platform version
Architecture
Device model

These fields are only necessary when testing a website that specifically relies on User-Agent Client Hints.

---

Using the profiles

After installation:

Open the website that needs testing.

Open Chrome DevTools.

Windows

F12

Device Toolbar:

Ctrl + Shift + M

macOS

Open DevTools:

⌘ + ⌥ + I

Device Toolbar:

⌘ + Shift + M

Select:

iPhone Duo Outer

or:

iPhone Duo Inner

Reload the page after changing profiles.

---

Screenshot workflow

For screenshots:

Open Device Toolbar and choose the required Duo profile.

Open Chrome Command Menu.

Windows

Ctrl + Shift + P

macOS

⌘ + Shift + P

Search:

Capture screenshot

This makes the profiles useful for:

UI screenshots
A/B testing
Marketing creative
QA documentation
Product demos
Video capture
Responsive design reviews

---

Uninstalling the profiles

Windows

Close Chrome completely.

Open Command Prompt inside the repository folder and run:

python tools\duo_profiles.py remove

or:

py -3 tools\duo_profiles.py remove

---

macOS

Close Chrome:

pkill -x "Google Chrome"

Enter the repository folder:

cd ~/Downloads/iphone-duo-chrome-devtools-profiles-main

Run:

python3 tools/duo_profiles.py remove

Reopen Chrome afterward.

---

Diagnostic commands

Windows

List installed custom devices:

py -3 tools\duo_profiles.py list

Run diagnostics:

py -3 tools\duo_profiles.py doctor

Remove Duo devices:

py -3 tools\duo_profiles.py remove

---

macOS

List installed custom devices:

python3 tools/duo_profiles.py list

Run diagnostics:

python3 tools/duo_profiles.py doctor

Remove Duo devices:

python3 tools/duo_profiles.py remove

---

Technical details

Chrome stores custom DevTools devices inside the selected profile's:

Preferences

file.

The relevant preference is:

devtools.preferences.custom-emulated-device-list

The installer:

Finds the selected Chrome profile
Reads existing custom devices
Creates a Preferences backup
Adds or updates the Duo profiles
Preserves unrelated custom devices
Writes the updated Preferences file
Verifies that the Duo profiles exist on disk

---

Preferences backup

Before the Preferences file is changed, the installer creates a timestamped backup.

Example:

Preferences.duo-backup-20261007-142300

This allows the original Chrome configuration to be recovered if necessary.

---

Important limitations

Chrome currently does not provide an official:

Import Custom Devices

function for custom DevTools device profiles.

The automatic installer therefore modifies Chrome's internal DevTools Preferences configuration.

Because this is an internal Chrome setting:

• Chrome may change the storage format in future versions.
• Behaviour may differ between Chrome versions.
• Manual setup remains available as a fallback.
• Chrome emulation is not physical-device testing.
• Chrome does not emulate Safari/WebKit.
• Hardware hinges and cut-outs are not currently simulated.
• OS-specific behaviour may differ from real hardware.

Final QA should still be performed on physical hardware whenever possible.

---

Reporting an issue

When reporting a problem, include:

Operating system:
Chrome version:
Chrome Profile Path:
Installer output:
Whether Chrome was fully closed:
Whether the profiles appear in Settings → Devices:

Chrome version and Profile Path are available from:

chrome://version/

---

Contributing

Contributions and improvements are welcome.

Useful contributions include:

Chrome compatibility updates
Improved installers
Verified viewport information
Safe-area information
macOS improvements
Windows improvements
Linux improvements
Documentation fixes

Pull requests can be submitted through GitHub.

---

Disclaimer

This project is unofficial.

The presets are intended for responsive design and development testing only.

No claim is made that the profiles reproduce physical Apple hardware, Safari/WebKit behaviour or future production device specifications exactly.

---

License

MIT License.

Free to use, modify, redistribute and share.