Chromeでどんな画面でもスクショ取れる方法

概要

AWSコンソールが代表例だけど、やたらめったらスクロール表示されてスクショ撮りたいのに上手くいかないなんてことはないだろうか？
今回はそんなお悩みにChrome拡張などを追加せずに解決する方法をお伝えしたい

前準備

Chromeが必要だ
他のブラウザでもできるかもしれないけど、面倒なのでChromeしか試していないぞ

工程

• Chromeのデベロッパーツールを表示する
• デバイスのツールバーを切り替える
• 画面サイズを指定する
• ハンバーガーメニューからスクショを撮るを実行

Chromeのデベロッパーツールを表示する

右クリックの検証を選んだ時に出てくるあれね

デバイスのツールバーを切り替える

画像左上のスマホとタブレットが重なってるようなアイコンね

画面サイズを指定する

切り替えた後に出てくるツールバーに対しての設定ね
画像のようにレスポンシブを選んで、縦横はスクロールが全表示されるように調整してみて

ハンバーガーメニューからスクショを撮るを実行

画像の縦に三つ並んだ点からメニュー開いてスクショを撮ろう

撮れた作品

こんなすごいのを撮れたぞ！！

CloudWatchメトリクスで50個くらいのメトリクスを一気に表示したものだな
これは極端な例だけど、例えば構成図とか作ってどうしてもスクロール部分が出ないとかあれば有用なんじゃないかと思うよ