見出し画像

Webブラウザからデザイン要素を抽出する4つのChrome拡張

noteマガジン『スラッシュワーカーのブックマークラボ』連載中、ただ「ラボ」って言ってみたかったKOHです。

このマガジンではスラッシュワーカーに向けて便利でお得なサイトやツールをご紹介しています。

そもそもスラッシュワーカーってなに?というひとは、こちらの記事がおすすめです!

あとで読む場合は画面下部の♡を押すと、noteアカウントの[スキした記事一覧]に保存されますよ〜!

ColorZilla

画像1

ブラウザ上のあらゆるカラーコードを瞬時に抽出可能。この黄色背景もColorZillaを使って右のイラストカラーから黄色を抽出している。

FireShot

画像2

Webページの上から下まで全体スクリーンショットが可能。Macの場合shift+command+Yのショートカットキーで、一撃キャプチャ。

Page Ruler Redux

画像3

Webページ上のコンテンツのサイズを測れるツール。 余白の確認や、コンテンツ/画像サイズ知りたい時に便利。

What Font

画像4

Webページ上のテキストをクリックするだけでフォントの種類やサイズ、カラーコードなどが一目でわかるツール。

Twitterもよろしくお願いします!

筆者のTwitterではこのような知って得なWebサイト、ツール、アプリケーションなどをご紹介しています。

Web系のお仕事ならば特に、これらのツールは知れば知るだけ引き出しが増えるので、ぜひブックマークをして情報資産にしていただければと思います。

▶︎KOHのTwitterをフォローする

この記事が気に入ったら、サポートをしてみませんか?
気軽にクリエイターの支援と、記事のオススメができます!
KOH

食卓のおかずが一品増えます

ありがとうございます!
5
元くつざわリモートマネージャー・マーケティングコンサルタント。このnoteではSNSの解説、攻略を中心に執筆しています。個人の発信や企業のマーケティング施策にお役立てください。Twitter攻略の有料記事が鬼売れてます。