IDEA ATOZ

管理人がみつけたWebサービスや役立つ情報をお届け

レスポンシブデザイン用の画像を一括生成してくれるサイト「Responsive Image Breakpoints Generator」

3

160420_a

Responsive Image Breakpoints Generator

「Responsive Image Breakpoints Generator」は、レスポンシブデザイン用に画像をまとめて複数サイズ生成してくれるサイトです。様々な画像サイズの画像をいちいち用意せずとも、元となる一枚をブラウザ上にアップロードするだけで簡単にレスポンシブデザイン用の画像を作成することができます。また、貼付け用コードも同時に生成される実用的なものとなっています。

面倒なリサイズ作業を自動でやってくれる

生成したい画像サイズのパターンや容量などを設定します。

160420_c

元となる画像を「UPLOAD FILE」よりアップロードします。

160420_b

生成された画像が一覧で表示されます。「View image」より画像を確認できます。

160420_d

生成された画像サイズの比較が確認できます。

160420_e

htmlの画像タグのサンプルコードも一緒に作成されます。

160420_f

レスポンシブデザイン用の画像の準備が面倒なときなどは、「Responsive Image Breakpoints Generator」に任せてみてはいかがだろう。それぞれ画像に応じたマークアップが用意されているのは便利だろう。是非、お試しあれ。

ウェブサービス

関連記事

あらゆるフォーマットに対応!簡単にファイル形式を変換してくれる便利サイト「Convert Files」

「Convert Files」は、Web上でファイルの形式を変換をしてくれるウェブサイトです。ものすごい数のフォーマットに対応しておりササッとに変換をすることができます。仕事などの際、開くことができない形式のファイルを変換して開けるようにしたいってときなんかに便利です。

顔を自動検出してモザイクを掛けてくれるWebサービス「Privacy Image Editor」

「Privacy Image Editor」は、指定した画像に自動でモザイクを掛けてくれるWebサービスです。ブラウザ上で画像をアップすることで手軽にモザイク処理を行うことができます。自動で顔を認識してエフェクトを掛けてくれるのでちょっとした写真にモザイクを施したいときなかに便利です。

簡単にSVGベースのシームレスなパターン画像を生成してくれるWebサービス「Plain Pattern」

「Plain Pattern」は、SVGベースのシームレスなパターン画像を簡単に生成してくれるWebサービスです。ブラウザ上でプレビュー確認しながらサッサと編集ができます。サイト制作やPhotoShopで継ぎ目のない素材を使いたいときに便利です。

あらゆる数学の記号や数式を簡単に生成・検索できるウェブサービス「SearchOnMath」

「SearchOnMath」は、あらゆる数学の記号や数式をビジュアル的に確認しながら簡単に生成できるウェブサービスです。大学等で多く利用されるLaTeXのような出力に近い形を直感的に利用することが出来ます。また、ブラウザ拡張機能を利用すればページ上の使われている数式をすぐに検索できるので、ちょっとした数式を調べたいなってときに便利です。

キーボードで入力した文字がドラムパターンになるWebサービス「typedrummer」

「typedrummer」は、キーボードでタイプしたアルファベットがドラムパターン音として自動演奏してくれるサービス。入力したそれぞれの文字は様々なドラム音に対応して音を奏でてくれる。

お手持ちの画像を簡単にポリゴンデザインに変換してくれるサイト「Kubist」

今、フラットデザインと共に静かに流行っているポリゴンスタイル。「Kubist」は、手持ちの画像を簡単にポリゴンスタイルへサッと変換してくれるサイトです。すべてブラウザ上で完結することができ、IllustratorやPhotoshopなどのソフトを使用しなくともブラウザ上ポリゴンスタイルを作成することができます。

適当なテキストからアバターを自動生成してくれるwebサービス「FlatHash」

「FlatHash」は、任意の適当なテキストを入力するとアルゴリズムに従ってアバター画像を生成してくれるサイトです。髪、口、鼻、目などパーツがそれぞれ用意されており、入力したテキストによって異なるアバターを創りだしてくれます。SNSなどで使用するアバターに困った際は使ってみると便利かもしれません。

様々な条件に従って画像をリサイズできるサービス「Bulk Resize Photos」

「Bulk Resize Photos」は、指定した条件に従って画像をリサイズすることが出来るできるサービスです。シンプルで洗練されたデザインで使いやすいのが特徴。ブラウザ上で条件を設定するだけなので、ちょっとした画像をササッと目的のサイズに変換したい時に便利です。

Google人工知能Deep Dreamsを簡単に適用できるサービス「Dreamscope Dreamer」

「Dreamscope Dreamer」は、指定した画像にGoogleの人工知能「Deep Dream」を使って悪夢のような画像を生成してくれるWebサービス。Deep DreamはGoogleが公開したオープンソースプログラムの1つで、過去に学習していたパターンと類似している領域を検出して学習済みパターンでそれを置き換えるというもの。この画像認識アルゴリズムを利用することでまさに『AIが見る悪夢』といわれるような凄まじい画像を作り出してくれる。

サクッと変換!指定したWebページをPDFに変換して保存できるサイト「PDF Burger」

>「PDF Burger」は、指定したURLのウェブページをPDFファイルに変換して保存できるサイトです。日本語にも対応しており文字化けせずに変換することが可能です。Webページをオフラインで持ち運びたいってときに活用すると便利なサービスです。 WebページをPDFに変換するだけでな、くPDF同士の結合や、OfficeファイルのPDF化などの処理も行うこともできます。

Message

メールアドレスが公開されることはありません。