29 kickass Chrome extensions for design

クライアントの注目を集める画像を作成しなければならないフリーランサーとして、私はいつも自分の仕事を100倍楽にしてくれる最高のGoogle Chrome extensions for designを探し回っています。

あなたがベテランのデザイナーでも、これから始める人でも、この投稿を読み終わる頃には、さらに良い作品を作る(そして、より効率的になる)のに役立つ新しいツールを少なくとも 1 つ手に入れていることでしょう。

スクリーンショットと注釈 Chrome 拡張機能-

Awesome Screenshot

Awesome Screenshot は、オンライン中にスクリーンショットやスクリーン レコーディングを行う際に超便利なツールです。

Awesome screenshot

Features

  • ブラウジング中にオンラインページをスクリーンショット
  • 画面のビデオ記録を作成
  • Crop and resize screenshot
  • 注釈やぼかしツールも利用可能
  • 画像や動画を簡単にダウンロードして保存

Get Awesome Screenshot

qSnap

qSnap はクロスオーバーです。Chrome用ブラウザ画面キャプチャツール。 Firefox、Safari、Opera、Internet Explorer。

qSnap スクリーンショット

特徴

  • 複数の画像を同時にキャプチャして注釈を付ける
  • 複数の画像を統合する
  • プラットフォーム間で画面キャプチャを共有

Get qSnap

Evernote Web Clipper

Evernote は人気のノートブックです。モバイル機器とデスクトップ/ラップトップ・コンピュータの両方で使用できるテイクアウト・ソフトウェアです。

Evernote ウェブクリッパーのスクリーンショット

特徴

  • オンライン中にスクリーンショットをキャプチャ
  • スクリーンショットをフォルダーで整理
  • デバイス間でスクリーンショットを同期させるので

Get Evernote Web Clipper

Image and photo editing Chrome extensions-

Colorzilla

Discovered a pretty color on someone’s website? Colorzillaを使ってそのHEXコードを調べてみましょう。

ColorZilla のスクリーンショット

Features

  • ブラウザ内の任意の場所から色を読み取る
  • RGB と HEX の両方を表示する。 コード
  • 他のアプリケーションに色を簡単に貼り付ける

Colorzillaを入手する

ProofMe for Canva

CanvaのProofMe拡張機能を使用すると、Canvaを使用できます。 Canvaで作成したデザインの校正を、友人や同僚にメールで送ることができます。

ProofMe for Canva スクリーンショット

特徴

  • Gmail、Facebook、Twitter、Slack などでシームレスに証明を共有
  • 線を描いたりテキストをハイライトしたりして、デザインに注釈を付けることができる。
  • フィードバックを簡単に取り入れ、新しいバージョンの校正を保存する

Get ProofMe

Picmonkey

Picmonkey はデザイナーのための最高の Chrome 拡張機能のひとつで、あらゆる Web ページで見つかったスクリーンショットや画像を即時に編集することが可能です。

PicMonkey のスクリーンショット

PicMonkey の使い方

  • Webページを表示しているときに PicMonkey のアイコンをクリックします。
  • サイドバーで任意の画像またはスクリーンショットを選択します。
  • トリミング、回転、画像フィルター、オーバーレイ、フォント、テクスチャ、フレーム、タッチアップツールなどの基本編集を実行します。

Get Picmonkey

Slidely Photo Remix

Slidely Photo Remixのカスタム編集機能でどんなオンライン画像にも命を吹き込みます。

Slidely Photo remix スクリーンショット

機能

    1クリックであらゆる画像にテキストのオーバーレイが追加されます。

  • 本格的なコラージュ、音楽付きスライド、あるいはビジネスのためのプロモーションを作成します。
  • メール、Facebook、Google Plus、Pinterest または Twitter で写真を共有します。

Get Slidely Photo Remix

Photomania

PhotoManiaの使いやすい効果で、どんなオンライン写真も瞬時に刺激的な視覚芸術へと変身させることが可能です。

PhotoMania のスクリーンショット

PhotoMania の使用方法

  • ブラウザで任意の画像にマウスを合わせます。 この例では、「スケッチ」効果を選択しました。
  • 画像を友人と共有する。

もし PhotoMania が気に入ったら、Polar と GooEdit も、ブラウザ上で簡単に写真を編集できる拡張機能として、2つあります。

Get PhotoMania

Sumo Paint

Sumo Paint はフル機能のペイントおよび画像編集拡張機能で、Photoshop などのツールに付属する価格タグなしで見事な画像を作成したい上級デザイナーのためのものです。

Sumo Paint のスクリーンショット

特徴

  • 57万人以上のメンバーと200万以上の画像からなる活発なアートコミュニティ
  • イメージレイヤーのサポート
  • 影、グロー、グラデーション、オーバーレイ効果
  • 曲線、レベルなどの画像調節ツール画像編集ツール
  • 画像編集ツール
  • Professional painting tools with over 300 brushes
  • Doz more features comparable to Photoshop’s standard tools

Get Sumo Paint

Your Graphic Designer

オンラインとオフラインで図面、ベクトルと絵画を作成できる HTML5 ベクター グラフィック エディターです。

Your Graphic Designer のスクリーンショット

特徴

  • フリーハンド描画
  • 線、図形、曲線を含むベクトル ツールのフル スレート
  • としてエクスポート SVG, PNG、JPG、BMP、PDF形式
  • 多言語サポート

グラフィックデザイナーを目指す

WhatFont

かっこいいWebフォントが目につき、それが何であるかを知る必要はありませんか?

WhatFont の使用方法

  • WhatFont アイコンをクリックすると、ページで使用されている異なるフォントのリストが表示されます。

WhatFont を入手する

Image Downloader

Image Downloader であらゆるウェブサイトからすべての画像を閲覧しダウンロードすることができます。

Image Downloader のスクリーンショット
  • すべてのページ画像 (ホストまたはリンクの両方) を見る
  • 幅、高さおよび URL で画像をフィルタする
  • 個々の画像をダウンロードするか開く

同じ機能の Gallerify 拡張機能も使用します。

Get Image Downloader

Pablo

Pablo Chrome 拡張機能を使用して、あらゆるソーシャル メディア プラットフォームに最適化した画像をデザインできます。

Pablo extension

How to use Pablo

  • 60万以上の無料のストック画像から選択するか、自分でアップロードすることができます。
  • 画像をホストするソーシャルメディアのプラットフォームを選択します。
  • テキストや他の画像フィルターを追加して、あなただけの傑作を作成します。

Pabloを入手

Emoji Keyboard

絵文字が好きですか?

Emoji Keyboard スクリーンショット

How to use Emoji Keyboard

  • ブラウザバーの絵文字キーボードアイコンにクリックします。
  • 使用したい絵文字を探します。

Get Emoji Keyboard

HoverZoom+

画像の上にマウスを置くだけで、あらゆるウェブサイトの画像を拡大することができます。

Hover Zoom のスクリーンショット

Features

  • Works with Amazon, Facebook, Flickr, Google (Google Images, Google+), Imgur, Pinterest, Reddit, Twitter.NET Framework (英語)。 Tumblr、Wikipedia、WordPress、YouTube、その他

Get HoverZoom+

Texmage

最初に画像をダウンロードして Canva や Picmonkey にアップロードして編集するという面倒なことをせずに Texmage を使用して任意の画像上にテキスト オーバーレイを作成することが可能です。

Texmage スクリーンショット

Texmage の使い方

  • 任意のWebサイトから画像を選択します。
  • 画像にテキストを追加し、サイズ、フォント、色、不透明度を調整します。
  • 新しい「Texmage」をダウンロードするか、ソーシャルメディアで共有します。

Get Texmage

Save To Google Photos

オンラインで見つけた画像をGoogleフォトに保存すると、後で作業をすることができます。

Save to Google Photos のスクリーンショット

特徴

  • Unlimited, 無料ストレージ
  • インターネット接続があればどこでも写真にアクセス可能
  • 重複した写真を自動的に削除
  • 複数のフォト アルバム

Get Google フォト

ウェブ開発者向け Chrome 拡張機能

PerfectPixel

開発者は PerfectPixel によって半透明な画像を作成することが可能です。HTMLページの上に透明な画像を重ねて、ピクセル単位で比較することができます。

PerfectPixel のスクリーンショット

特徴

  • 複数のオーバーレイをサポート
  • バージョンとスケーリングをサポート
  • ブラウジング セッション間でオーバーレイを保存

他の 2 つのオーバーレイ ツール (Bootstrap オーバーレイと Instant Wireframe) もチェックアウトする価値があるものです。

Get PerfectPixel

CSS Shack

CSS Shack は Chrome 拡張機能とデスクトップ アプリケーションで、ウェブサイト デザインやアプリのモックアップを簡単に作成することが可能です。

CSS Shack のスクリーンショット

特徴

  • レイヤースタイルの作成
  • スタイルを CSS にエクスポートして保存
  • 作成と管理に使用する。 Web スタイル ガイド

Get CSS Shack

CSS3 Generator

The CSS3 Generator extension は必要な CSS コードを作成するので、自分でコードを記述する必要はありません。

CSS3 Generator のスクリーンショット

機能

  • テキストとボックスの影
  • Hex/RGBA カラー
  • トランスフォーム
  • コラム
  • グラデーション
  • トランジション
  • そしてもっと!
  • CSS3 Generator
  • 機能

  • CSS3 Generator
  • 機能

  • そしてまたもっと!

Get CSS3 Generator

Page Ruler

Page Ruler では、任意のページで定規を描き、Web ページ上の任意の要素のピクセル寸法と位置を表示することができます。

Page Ruler のスクリーンショット

特徴

  • 幅 & 高さとトップ、ボトム を表示します。 左 & 右位置
  • 定規の端から伸びるガイド
  • 正確な変更を行うために定規のサイズと位置を手動で更新
  • 「要素モード」は、マウスオーバーしたページ要素の概要を表示
  • 任意の要素の親、子、兄弟要素を通してナビゲーション

ページ ルーラーを取得

Chrome のダルトーン化!(D.H.)

色覚異常は人口の約 5% が罹患していると言われています。 これは、コンピューター使用者の 20 人に 1 人の割合です! Chrome Daltonize 拡張機能は、色の詳細を増幅し、色覚異常のユーザーがコンテンツを見逃すことがないようにします。 のスクリーンショット

特徴

  • 色覚異常の人に画像がどのように見えるかをシミュレーションする
  • 色覚異常のユーザーに色を知らせ、詳細を見えるようにする

Get Chrome Daltonize

Windows Resizer ベータ

スクリーン サイズごとに異なる解像度を持つことがあります。 ウィンドウズ・リサイザーは、ウェブサイトが異なるスクリーンでどのように見えるかを、すべてブラウザのウィンドウで表示します。

Window Resizer Beta のスクリーン ショット

使い方

  • インストール後、拡張機能アイコンをクリックすると、以下の画像のようなダイアログ ボックスが開き、画面のサイズを異なる解像度に変更できますので、その画面サイズと解像度でウェブサイトがどのように見えるかをシミュレーションすることが可能です。

Get Window Resizer Beta

Web Maker

Web Maker は、オンラインではない時に HTML、CSS、または Javascript の要素を試してみたい開発者にとって完璧なツールです。

Web Maker のスクリーンショット

特徴

  • いつでも作品を保存して読み込むことができます。 どこでも
  • コード自動完成
  • CodePenで編集
  • スクリーンショットのキャプチャをプレビュー
  • Githubでオープンソース

Get Web Maker

Blue Button

Blue ButtonはDIYデザイナーにとって究極のスパイウェポンです。 メタディスクリプション、タグ、CSS、およびあらゆる Web サイトの「ボンネットの下」のすべてを検査するために、これを使用します。

Blue Button のスクリーンショット

特徴

  • すべての必須 Web デザイン、グラフィック、SEO要素をワンクリックで表示
  • タグ、メタ ディスクリプション、ヘッダー情報などの SEO 関連情報にアクセス
  • サイトで使用されているすべてのスクリプトとスタイルシートの一覧を表示
  • サイトのファビコンやタッチ アイコン、その他の画像も表示
  • 読み込まれている Google フォントを確認する

Get Blue Button

Inspirational Chrome extensions-

26.Blueボタンを取得する。 Flickr Tab

一度 Flickr Tab をインストールすると、すべての新しい Chrome タブで Flickr コミュニティから人気のある写真が表示されます。

特徴

  • Flickr コミュニティからの幅広い高品質画像
  • One->Flickr Tab は、Flickr コミュニティから人気のある写真を表示します。Flickr の画像にクリックでアクセス
  • ユーザーの他の写真へのインスタント リンク

Get Flickr Tab

Google Art Project

アーティストである場合、インスピレーションを得ることは常に簡単ではありません。 Google Art Project は、新しい Chrome タブを開くたびに、新しい芸術的な傑作を開いてくれます。

Google アート プロジェクトのスクリーンショット

特徴

  • ゴッホからモネ、現代のストリート アーティストまでの傑作
  • アートワークは毎日更新
  • 各イメージは接続されています。 Google Cultural Institute のウェブサイト

Googleアートプロジェクトを入手する

ブックマーク

ブックマークは、あなたの創造力を刺激し続けるために、ビジュアルブックマークを収集することが可能です。

Wookmark のスクリーンショット

Wookmark の仕組み

  • 他の Web サイトから簡単に画像をブックマークして保存できます
  • 創作活動をアップロードして、次のことを実行します。
  • グループを使ってムードボードを作る
  • 友人と画像を共有し議論する

Wookmarkを入手

Muzli 2

リアルタイムで入手する。デザインのインスピレーションを 写真、デザイン、UI/UXなど、ウェブ上のさまざまな情報を提供します。

Muzli 2 スクリーンショット

特徴

  • あなたの Chrome デフォルトページを最も新鮮なデザイン、UI で置き換えます。 UX やインタラクティブなニュース、ウェブ上の写真
  • Dribbble, Designer News, Sidebar, CSS Winner, The Next Web, and more

Get Muzli 2

以上、終わりです!-

以上、魅力的な画像を作成し、常にインスピレーションを得るためのデザイナー向け Google Chrome 拡張機能を 29 個紹介しました!