サイトのCSSを見たままリアルタイムに編集するツール色々。
WEBデザイン開発において、編集→リアルタイム反映というのはなかなか効率がよいですね。
ということで、各種、リアルタイムCSS編集ツールをピックアップします。

FireFox拡張 or スタンドアロンアプリ

FireBug - リアルタイムに指定部分のCSSが切り替え可能(参考記事)。CSS以外にも便利機能満載。



EditCSS - FireFox拡張で、エディタがインストールされ、エディタ編集と同時に即座にCSSが反映される。



CSSVista - IEとFireFoxの画面で一括プレビューが可能。



Web Developer ToolBar - WEBデザイナー必須のFireFox拡張。CSSの直接編集も可能。 他にもCSSやアクセシビリティに関する便利機能満載。



ブラウザ上で動作するオンラインツール

たぬきのしっぽ - CSSを編集したいサイトのURLを入力して、ブラウザ上でCSS編集



rendr - CSSとHTMLをリアルタイムに書き換え＆プレビュー



HTML Playground - リアルタイム編集＆辞書牽きも可能なツール



RealTime HTML Editor - リアルタイムHTMLエディタ



いろいろとありますが、使い分けで効率の良いデザイン開発をしましょう！

関連エントリ

• CSSベースのフォームテンプレート
• セクシーなCSSホバーボタンを作成するチュートリアル
• DIVを垂直方向に中央寄せするCSSサンプル
• CSSを使い、１枚の画像だけでカラフルなグラデーション背景を作る例
• CSSの小技集、20個