Core How-Tos

Emulate devices, networks and preferences

Emulate in DevTools+ by URLflows changes how Chrome presents one tab: a slower network or processor, a phone screen, dark mode, another language. It uses the same controls as DevTools, without opening it.

Start emulating

  1. Open the page, click the DevTools+ icon in the toolbar and click Emulate under Debug.
  2. Pick what you want to change. Each choice applies to this tab straight away, and the line at the top says what's emulated, such as "Emulating: Slow 4G, no cache, Dark."
  3. Press the refresh button in the header (Reload the page) to see a change from the first byte.

What you can emulate

  • Network: As is, Fast 4G, Slow 4G, 3G or Offline, and Disable the cache.
  • CPU: As is, or 4×, 6× or 20× slower.
  • Screen: a Device (iPhone SE, iPhone 15, iPhone 15 Pro Max, Pixel 8, Galaxy S23, iPad mini, iPad Air, Laptop or Desktop) with its size, touch and user agent, or a User agent on its own: Safari on iPhone, Safari on iPad, Chrome on Android, Safari on a Mac, Firefox on Windows or Googlebot.
  • Media and preferences: Color scheme (Light or Dark), Reduced motion, Contrast, Forced colors, Vision (Blurred vision, Reduced contrast, Protanopia, Deuteranopia, Tritanopia, Achromatopsia), Print styles (media: print) and Chrome's automatic dark mode.
  • Place and language: a Time zone, a Language and a Location from a short list of cities. Time zone and language apply to new scripts and dates, so reload the page to see them everywhere. The page still asks before it reads the location.
  • Rendering: Paint flashing, Layout shift regions, Frame rate meter, Layer borders, Scrolling performance issues, and Keep the page focused, so menus and pop-ups that close on blur stay open while you click away.

For a window size rather than a phone, use Resize the window.

The EMU badge

While anything is emulated on a tab, the DevTools+ icon on that tab shows EMU, and pointing at it says "Emulating on this tab." Emulation belongs to that tab only; other tabs load as usual.

The "debugging this browser" bar

Emulate works through Chrome's debugger, so Chrome shows a bar saying that DevTools+ started debugging this browser. That's expected, and it stays while emulation is on. The same bar appears for Console errors, a HAR recording and grabs of very tall elements.

Closing the bar (its Cancel button) stops emulation on that tab, just like Stop all. If Chrome says another debugger is attached, close DevTools for an extension or the other extension that's debugging the tab, and try again.

Stop emulating

  • Press Stop all, or set everything back to "As is". DevTools+ lets the debugger go, the EMU badge disappears and Chrome's bar closes (unless a HAR recording on the same tab still needs it).
  • Closing the tab stops it too.
  • What already loaded under emulation stays until you reload the page.

Chrome doesn't let extensions emulate on its own pages or the Chrome Web Store.

Related guides

Next, read Console errors, HAR files and DevTools, Check page info and accessibility or Troubleshoot common issues.