レスポンシブのチェックに役立つサービス「Resizer」

 
この手のリサイザーは様々なツールやサービスがありますが、Googleが公開した「Resizer」がシンプルで使いやすそうなので忘備録。

Resizer – Google Design

↓ヘッダー下部のタブよりサイズ変更ができます。


  • 非レスポンシブの要素をレスポンシブ化する「Reframe.js」
  • レスポンシブ対応の画像を生成してくれる「Responsive Image Breakpoints Generator」
  • レスポンシブデザインのパターン集「Responsive Patterns」
  • 軽快なアニメーションのバーガーメニュー「Ember Burger Menu」
  • レスポンシブデザインでのロゴパターン「responsivelogos」
RELATED POSTS
  • きれいなエフェクトの検索フォームUI「Inspiration for Search UI Effects」
  • CSSグリッドレイアウトのコードを生成できるツール「Griddy」
  • JPG・PNG・GIF・SVGの画像を圧縮してくれるWebサービス「Compressor.io」
  • 【jQuery】ページめくり効果を付けられる「OneBook3d」
  • 【jQuery】スクロールに合わせて要素を切り替える「Midnight.js」
  • クオリティの高いグラフを描画するjsライブラリ「Chart.js」
POPULAR POSTS
  • 【無料】漢字が使える日本語フリーフォント59選
  • 似たフォントを探したい!フォントを調べる時に役に立つツール・サイト10選
  • 無料で使える日本語・英語のかわいいフリーフォント20選
  • 無料で使えるおしゃれな英語の筆記体フリーフォント20選
  • CSSグラデーションの作成に役立つジェネレーター・Webサービスまとめ
RECENT POSTS
  • Neumorphismを簡単に作れるジェネレーター「Neumorphism.io」
  • マルチカラーグラデーションのコードをコピーできる「gradienta」
  • SNSで使用する画像・動画サイズのテンプレート集「SocialSizes」
  • やわらかいタッチのイラストをダウンロードできる「Open Doodles」
  • 簡単にホバーエフェクトを実装できるCSSライブラリ「Izmir Hover Effects」