CSSの制作・検証に役立つChromeの機能拡張のまとめ

CSSの制作時や検証時に役立つGoogle Chromeの機能拡張を紹介します。
いくつか機能がかぶっているので、お好みのものをご利用ください。

code cola
マウスカーソルを重ねた要素のスタイルを表示し、リアルタイムに値を変更することができます。

CSSViewer
マウスカーソルを重ねた要素にCSSで何を指定しているかが分かります。

[ad#ad-2]

Live CSS Editor
テキストボックスが表示され、そこにCSSを書くことでリアルタイムに反映されます。

CSS Tester
上記「Live CSS Editor」と同じで、書いたCSSがリアルタイムに反映されます。こちらはシンタックスハイライトに対応しています。

[ad#ad-2]

CSS Reloader
ページをリロードせずに、CSSのみリロードします。

Stylebot
ページ内の指定した要素のスタイルシートをリアルタイムに変更します。

MeasureIt!
CSSに直接関係ありませんが、要素のサイズを測る定規です。

Eye Dropper
カラーピッカー。吸い取ったカラーの履歴も保存します。

Pendule
CSSの無効化（インラインのみなども可）、CSSの表示（整形対応）、CSSのチェックをはじめ、他にもHTML、JavaScript関係も充実したウェブ開発総合ツール。