📸 Come catturare screenshot con la Developer Toolbar di Chrome (Run Command)

  


Una guida passo-passo per usare la funzione nascosta di cattura screenshot nei Chrome DevTools, accessibile dal Command Menu (Run command).

🔗 Ti piace Techelopment? Dai un'occhiata al sito per tutti i dettagli!

1. Aprire gli Strumenti per sviluppatori

Per aprire i Chrome DevTools usa una di queste scorciatoie:

  • Windows/Linux: F12 oppure Ctrl + Shift + I
  • macOS: + + I
  • Oppure clic con tasto destro del mouse sulla pagina → Ispeziona

2. Aprire il Command Menu "Run command"

Con i DevTools aperti, apri il Command Menu:

  • Windows/Linux: Ctrl + Shift + P
  • macOS: + Shift + P
  • oppure clic sul menu  in alto a destra e cliccare su "Run command"

Compare una barra di ricerca nella parte alta: è la “palette” comandi dei DevTools.


3. Trovare i comandi per gli screenshot

Nel Command Menu digita screenshot. Vedrai queste opzioni principali:

  • Capture full size screenshot
  • Capture screenshot
  • Capture node screenshot
  • Capture area screenshot

4. Eseguire il comando

  1. Usa le frecce ↑/↓ o il mouse per evidenziare il comando desiderato.
  2. Premi Invio per eseguirlo.
  3. Chrome catturerà lo screenshot e lo salverà nella tua cartella di download.

5. Consigli pratici

  • Usa node screenshot per componenti UI specifici.
  • full size è ottimo per mockup e test di layout lunghi.
  • Con area screenshot puoi “ritagliare” velocemente senza editor esterni.
Puoi catturare lo screenshot di un nodo HTML anche dalla sezione "Elements" cliccando con tasto destro del mouse sul nodo che ti interessa e scegliendo "Capture node screenshot" da menu contestuale:


FAQ rapide

Serve un’estensione? No, è tutto già integrato.

Dove vengono salvati i file? Nella cartella Download impostata in Chrome.


Troubleshooting

  • Screenshots vuoti con canvas/video: Chrome a volte non renderizza i contenuti dinamici. Usa strumenti di cattura del sistema operativo.
  • Elementi fuori viewport non visibili: Verifica di usare full size screenshot.
  • File troppo grande: Ridimensionalo con un editor immagini.
  • Shortcut non funzionano: Controlla conflitti con scorciatoie di altre app o estensioni del browser.
Nota: i siti con DRM (streaming video) possono bloccare la cattura degli screenshot.



Follow me #techelopment

Official site: www.techelopment.it
facebook: Techelopment
instagram: @techelopment
X: techelopment
Bluesky: @techelopment
telegram: @techelopment_channel
whatsapp: Techelopment
youtube: @techelopment