Creating a custom device in Google Chrome DevTools
Create a Xiaomi Mi Note 10 Pro emulated device

Search for a command to run...
Create a Xiaomi Mi Note 10 Pro emulated device

No comments yet. Be the first to comment.
Clean your email list even before sending it to a mass emailing solution like AutoSend to avoid a high bounce rate

Try using an alternative to openclaw, which they claim is cheaper to use

Using types (and interfaces) to define a blueprint of a variable

Using GraphQL as an alternative to REST API for Hashnode

making makemigrations work in Django when migrations is not pushed to git

Google Chrome's DevTools has the option to view your webpage on an emulated mobile device under Inspect Element > Toogle Device Tool Bar (2nd option on top left hand corner).

If you want to add your own device, say for example, Xiaomi Mi Note 10 Pro (which was breiefly available in the EMEA region in early 2020) which has a reolution of 1080 x 2340 pixels, 19.5:9 ratio (~398 ppi density), we need to find the DPR or Device Pixel Ratio. Click on Edit.
Long story short : Magic number is 150. : https://stackoverflow.com/a/23958504/126833
Device Pixel Ratio = PPI Density / 150.
So for Mi Note 10 Pro, the DPR is 398 / 150 = 2.6533

So the width of the width and height that you need to give in the Device's width and height textboxes shouldn't be 1080 and 2340 but 1080 / 2.6533 and 2340 / 2.6533 respectively. Which equates to 407 x 882