![](https://beeyanblog.com/wp-content/uploads/2019/10/PAK85_coding15095904_TP_V-1024x682.jpg)
どうも、べ〜やんです。
今回は、複数のレスポンシブを同時に確認できるChromeの拡張機能『ResponsiveViewer』を紹介します。
![](http://image.moshimo.com/af-img/0288/000000021448.png)
目次
ResponsiveViewerとは
ResponsiveViewertとは無料で使用できる2019年11月18日にリリースされたばかりの新しいChromeの拡張機能です。
複数のデバイスでどのように表示されているのかを同時に確認できる機能です。
ResponsiveViewert-Chromeウェブストア
使い方
ResponsiveViewertはChromeの拡張機能なので、Chromeを使用してください。
ChromeウェブストアにアクセスしてResponsiveViewertを追加します。
ResponsiveViewert-Chromeウェブストア
確認したいページにChromeでアクセスして、ResponsiveViewertのアイコンをクリック。
サイドバーから確認したいデバイスを選択。右上の『+』マークから任意のサイズを指定しることもできます。
![](https://beeyanblog.com/wp-content/uploads/2019/11/81d4e6a6e37403c79eea9238c75c3d7b-1024x545.png)
縦向きと横向きの確認が可能。
![](https://beeyanblog.com/wp-content/uploads/2019/11/cf25e936a581c65a7530faaa838dde45-1024x550.png)
縦並びと横並びが選択可能。
![](https://beeyanblog.com/wp-content/uploads/2019/11/48de72b6e978348d86948fb6f2461deb-1024x557.png)
おわりに
今回は、複数のレスポンシブを同時に確認できるChromeの拡張機能『ResponsiveViewer』を紹介しました。
最近は、デバイスのサイズも多様になってきたので複数のサイズを同時に確認できるのはありがたいですね。
![](http://image.moshimo.com/af-img/0288/000000021438.png)