webclips

レスポンシブ対応の画像を生成してくれる「Responsive Image Breakpoints Generator」

WebDesign
Webサービスレスポンシブ

2016/03/28

レスポンシブデザインのメインヴィジュアルで使用するような画像を設定したブレイクポイント毎に最適化し生成してくれる「Responsive Image Breakpoints Generator」。画像のリサイズならphotoShopなどで、ちゃっちゃとやった方が早いと思いますが、仕組みを理解するという意味では面白いサービスです。

Responsive Image Breakpoints Generator

↓サイズ毎のイメージも確認でき、HTML5のソースも表示されます。

Responsive Image Breakpoints Generator

PickUp

CSSでクールなグリッチエフェクトを実装できる「CSS Glitch Effect」
キレイな装飾のテキストアニメーション「Decorative Letter Animations」
【CSS】border (枠線) の使い方 -初心者向け-
アニメーションで変化するカスタムカーソル「Custom Cursor Effects」
【CSS】スターウォーズのイントロを表現できるライブラリ「starwarsintro.css」
【jQuery】サイドバーをスライドで表示できるSimple Sidebar