デバイスごとのスクリーンショットを一括生成「Responsive Screenshots」
PC・ノート・タブレット・スマホのスクリーンショットをURLを入力するだけで一括生成できる「Responsive Screenshots」の紹介です。
ジェネレーター
YoutubeやGoogleMapをレスポンシブ化するジェネレーター「Embed Responsively」
YoutubeやGoogleMapなどの埋め込みコードをレスポンシブに変換してくれるジェネレーター「Embed Responsively」を紹介します。
PNG・GIF・SVGなどの画像フォーマットからjpegに変換してくれる「jpeg.io」
さまざまな画像フォーマットのファイルを最適化(ファイルサイズ)したjpegに変換してくれるWebサービス「jpeg.io」の紹介です。
ギザギザボーダーを作れるジェネレーター「CSS Jagged Border Generator」
ギザギザボーダーをCSSのみで簡単に生成することができるジェネレーター「CSS Jagged Border Generator」の紹介です。
CSSで出力できるドット絵ジェネレーター「Pixel Art to CSS」
自作のピクセルアートをCSSで出力することができるピクセルアートジェネレーター「Pixel Art to CSS」の紹介です。
画像をアップするだけでブラウザイメージを生成できる「Browser Frame」
Webサイトのスクリーンショットをアップするだけでブラウザに埋め込んだようなイメージを生成できる「Browser Frame」の紹介です。
SVGで背景パターンを作成できる「Hero Patterns」
パターンをカスタマイズしてコピペで使用できるSVGパターン作成サイト「HeroPatterns」の紹介です。背景素材として重宝しそうなサービスです。
CSSで出力する三角形ジェネレーター「CSS Triangle Generator」
CSSで三角形を作りたい時に便利な三角形ジェネレーター「CSS Triangle Generator」の紹介です。最短で理想な三角形を作れるよう工夫を凝らしたジェネレーターです。
コピペで使えるCSSアニメジェネレーター「WAIT! Animate」
14種類のCSSアニメーションのコードを生成してくれるCSSアニメジェネレーター「WAIT! Animate」の紹介です。アニメーションの具合を確認しながら設定できるがGOOD！
SVGでダミー画像を生成できるサービス「Placeholder pics」
モックアップ制作などで役に立つ、ダミー画像(プレースホルダー)をちゃっちゃと生成することができるサービス「Placeholder pics」のご紹介。
レスポンシブ対応の画像を生成してくれる「Responsive Image Breakpoints Generator」
レスポンシブデザイン制作で役に立ちそうなブレイクポイント毎に画像を生成してくれるサービス「Responsive Image Breakpoints Generator」のご紹介。
プロフィール画像やアイコンに使える似顔絵ジェネレーター10選
LINEやTwitter・Facebookなどのソーシャルサービスのプロフィール画像などにも使えそうな似顔絵ジェネレーターを厳選して10サイトご紹介。
【CSS】CSSだけで作られた簡単に使えるアイコンセット
矢印・メニューボタン・チェックマークなど、レスポンシブデザインにも使えるCSSだけで作られたアイコンセットを提供しているサイトをご紹介。
バーガーメニューなどアニメーションで切り替わるボタンを生成できる「Transformicons」
レスポンシブWebデザインなどのグローバルメニューで使えそうなアニメーションで切り替わるボタンを生成できるジェネレーター「Transformicons」の紹介です。
コピペするだけで使えるCSSボタンジェネレーターまとめ
フラットなボタンから、グラデーションをかけた立体感のあるボタンまで、デザインをしてコピペするだけで使えるCSSボタンジェネレーターを厳選して10サイト紹介します。
