WebデザイナーのためのオススメのChrome拡張機能

WebデザイナーのためのオススメのChrome拡張機能

firefoxで、firebugでコードを見直していたんですが、firefoxが重くてね。。。
それに、よくブラウザが固まって動かなくなる。

「firefoxよりchromeのほうが良い」っていう声がありますので今更ですがchromeを導入しました。

photo credit: flod via photopin cc

オススメ拡張機能

web開発に良いたくさんの拡張機能がありますね!
今回はオススメの拡張機能のご紹介です。

画面上の色を取得できるChrome拡張機能「Color Picker」

Color Picker

URLColor Picker

Color Picker

インストールをすると、chromeの右上に「Color Picker」のアイコンが表示されます。
「十字マーク」が表示されるので、取得したい色の上へ持っていきます。
その場でクリックすると、カラーコードが表示されますので便利です。

文字の上にカーソルを置くだけでフォント名が分かる「WhatFont」

WhatFont

URLWhatFont

WhatFont

インストールをすると、chromeの右上に「WhatFont」のアイコンが表示されます。

WhatFont

調べたいテキスト文字の上をクリックすると、line-height、文字サイズまでわかります!

サイトに使われている機能・CMSが細かく分かる「BuiltWith Technology Profiler」

BuiltWith Technology Profiler

URLBuiltWith Technology Profiler

BuiltWith Technology Profiler

インストールをすると、chromeの右上に「BuiltWith Technology Profiler」のアイコンが表示されます。

BuiltWith Technology Profiler

気になるページがあったらとりあえず、この機能で調査しています!

ウェブ開発者に便利な機能「Pendule」

Pendule

URLPendule

Pendule

インストールをすると、chromeの右上に「Pendule」のアイコンが表示されます。

Pendule

Penduleのアイコンをクリックするとメニューが表示されます。

Pendule

altを表示させたり、画面サイズを変えたり、CSSを切ったりすることが出来ます。

ブラウザのアドレスバーからTodoリストを管理する機能「Todoist」

Todoist

URLTodoist

Todoist

インストールしたら、ログインメニューが出てきます。

Todoist

ログインしたら、Todoリストが簡単につくれます! 

まとめ

Web開発に便利な機能がたくさんあります!
とりあえず、使ってみて駄目だったら削除すればいいだけなので使ってみましょう!

WebデザイナーのためのオススメのChrome拡張機能

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

*