Realtime CSS Editing With Any Text Editor

Sick of viewing your css changes by manually refreshing several browsers to see your tweaks? no problem, this small Ruby gem is designed to automate that process, in effect transforming any text editor into a realtime css editor.

Installation

$ sudo gem sources -a http://gems.github.com
$ sudo gem install visionmedia-css

Realtime Editor Examples

$ css watch path/to/style.css
$ css watch path/to/style.css --browsers safari,firefox,opera --interval 1

Prepping CSS

The only thing needed to prep your stylesheet document with our gem is to simple add the following line somewhere, of course pointing to the page you wish to monitor or 'watch'.

/* watch: file:///Users/tjholowaychuk/Scripts/gems/css/test/index.html */

Watch The Screencasts

Realtime CSS Editor Screencast

Bookmark/Search this post with:

Add new comment

Comments

Sep 1 2009 - 9:51pm - Jazz

I never knew we can do that. That's good. I know how tiring it becomes to refresh page and see the changes. Sometimes i really get irritated. I will use this technique!!