«   Previous tip Next tip   »

Chrome DevTools: Add a new custom device as a preset

Last updated: 30th October 2020
Add a new custom device as a preset


Do you frequently emulate devices of a certain dimension? In the DevTools Device Mode, you can add new device presets.

How to use this feature

  1. Select Show Devices from the DevTools Command Menu (Cmd + Shift + P).
  2. Select Add custom device.
  3. Enter the device information.
    • Device Name
    • Width / Height
    • Device Pixel Ratio
    • User agent string
    • Device Type
  4. Select Add Device.

Now, when you toggle device emulation on, you can select your newly created device from the device toolbar.

Extra resource

In addition to emulate device dimensions, you can also emulate various device sensors.

«   Previous tip Next tip   »

Sign up to receive a developer tip, in the form of a gif, in your inbox each week