Skip to content

Instantly share code, notes, and snippets.

@wouterraateland
Created November 2, 2022 10:18
Show Gist options
  • Save wouterraateland/4f3effdbc6b7b20f5948d7c37ad162e7 to your computer and use it in GitHub Desktop.
Save wouterraateland/4f3effdbc6b7b20f5948d7c37ad162e7 to your computer and use it in GitHub Desktop.
Consistent screenshots in browser

Consistent screen setup:

  1. Open devtools alt + cmnd + I
  2. Open device toolbar cmnd + shift + M
  3. Click on dots top right and click "Add device pixel ratio" (DPR)
  4. Set DPR (probably to 2.0)
  5. Set resolution

Consistent screenshots:

  1. Select the element you want to capture in the "Elements panel"
  2. Open command center cmnd + shift + P
  3. Type "node" -> will show "Capture node screenshot"
  4. Press enter
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment