Just go to the ThemeRoller Firefox Developer Bookmarklet
page
and drag the bookmarklet link into your Firefox toolbar. Then you can
open the bookmarklet on any page you’d like and style away! The entire
feature set of ThemeRoller is included, meaning you can view and
download themes from the gallery or design your own, and download the
Theme once you’re done.

The bookmarklet uses fixed positioning within your window, so it will
actually stick to your browser chrome rather than a location on your
page. This is particularly useful when working with long scrolling pages
and allows the tool to feel a lot like a native panel in a design
application like Photoshop.

Just like the full ThemeRoller application, the bookmarklet tracks all
of your design changes in your browser history, letting you use your
back and forward buttons to undo and redo design edits as you work! If
you back up to a change and decide you’d like to continue editing from
there, simply refresh the page and relaunch the bookmarklet - it will
load the design into the ThemeRoller and you can continue designing.

Unlike ThemeRoller, the bookmarklet’s download button will direct you
straight to a zip file containing your theme. We did this assuming that
if you’re using the bookmarklet, you’re probably already styling
existing markup and likely just need a theme.

Note Due to security restrictions in Firefox, the bookmarklet will
not work on local “file://” URLs. Your files will need to direct your
browser to a page on a webserver in order for it to work. If you’re on a
mac and trying to work locally, we’d highly recommend using
MAMP to set up a quick web
server, it’s free and easy.

We’ve been working hard to make ThemeRoller and the jQuery UI CSS
Framework a useful tool for all. We’d love to hear what you think!

Comments

<div id="commentNumber1" class="commentEntry">

<p>Fantastic work guys!! This really brings the convenience of themeroller and jquery-ui to a whole new level.&nbsp; I can only imagine where all this will be in another 12 months.&nbsp; Keep up the great work!

</div>
<p class="posted"><a href="#commentNumber1">Comment</a> by

Rob Monie
on 02/13 at 04:52 AM

<div id="commentNumber2" class="commentEntry">

<p>This sounds like something I’ll use.&nbsp; Typically I edit all of my own CSS, but it’s worth trading control/convenience for jQuery’s coolness.&nbsp; Hopefully this solves the problem of having to download/upload a dozen or so themes to get the look you want.

<p>Great work guys on the css framework, themeroller, and everything. I was amazed by how easy it was to include the css framework on the Finder plugin. At first I thought that I would have to do extra coding for getting it to work, but at the end it saved me lots of time (and lines).

Thanks for everything, and thanks for the link as well

</div>
<p class="posted"><a href="#commentNumber5">Comment</a> by

Nicolas Rudas
on 02/14 at 07:29 AM

<div id="commentNumber6" class="commentEntry fg">

<p>@Nicolas Rudas: That’s great to hear that it was so easy to implement the framework in an existing codebase! We’d love to hear any feedback on how it can be improved as well, so definitely let us know if you have ideas. The Google jquery-ui-dev group would be a good place to discuss them.

<p>@Scott: I’ve been meaning to reply to the discussion you opened at the google group but I’m a bit short of time these days. Perhaps over the weekend I’ll post something about the whole process.

Yeah I saw the contest but as I don’t live in the US I found it unnecessary to participate - on the other hand I could join in and in case of winning you could ‘donate’ the prize to a jQuery UI contributor :)
Loved your entries tho, pretty cool stuff you did there.

<p>Yes, seems to be so cool ! But I can’t make it work : impossible to drag it to the firefox toolbar. If I click on the link, it’s ok on the jquery page, but does not work on my own page (which uses jquery UI of course). An idea about what can be wrong ?

<p>I’m not able to make themeroller dev tool to work on any jquery website. I added it inside bookmarks (FF4) but when i try to use it, it appears correctly but it doesn’t change the sytle on the fly. Does it require a particular configuration of jquery sites in order to work?

</div>
<p class="posted"><a href="#commentNumber25">Comment</a> by

Andrea
on 04/09 at 02:34 PM

<div id="commentNumber26" class="commentEntry">

<p>I’m having the same problem Andrea is. I can get the tool to show up, but selecting a style will not make that style apply to the page I’m on. It doesn’t even work on the Tool’s page where it says “click to give it a try”. Firefox 3.6.16