My favorites | Sign in
Project Home Wiki Issues
New issue   Search
  Advanced search   Search tips   Subscriptions
Issue 179: Feature request: Create a unified patch from CSS changes
161 people starred this issue.
Comments by non-members will not trigger notification emails to users who starred this issue.
Back to list
Status:  Fixed
Owner:  kpdecker
Closed:  Jan 2011
Cc:, kpdecker,

Sign in to add a comment
Reported by, May 15, 2007
A really great feature for Firebug would be to create a patch from the
changes you've made to a page's CSS file(s) while in Inspect mode. Often,
you'll want to make a bunch of changes to tweak a whole page to get it
looking right, then have to go recreate all those changes in your real CSS

Having a patch creator would be a nice way to quickly apply those changes
to your CSS and see exactly what has changed. If there is interest, I can
create a reverse bounty at to try and raise funds for this.


May 28, 2007
Project Member #1
(No comment was entered for this change.)
Labels: -Type-Defect Type-Enhancement
Aug 10, 2007
I would also like to see this feature, it would greatly speed up my development on
CSS in web pages when testing.
Oct 8, 2007
Definitely a feature that is needed
Oct 8, 2007
I also nominate the "save changes" feature.  Firebug's CSS tool is by far the best
one I've found (or at least the open source community's CSS tool that is most
compatible with my design methods. :-)

Firebug has become my HTML RAD tool of choice...except that the inability to save
one's changes tends to remove the "Rapid" from "RAD".
Oct 8, 2007
Anybody have an idea of how much $$$ it would take to write this feature in? It could
either be a diff, an easy way to save whole CSS files or a way to be in localdev mode
where you could actually change CSS files on your local box.

If one of the devs has an idea for the cost of a bounty, I'll start a ChipIn to raise
some money for this...but it helps to have a finite goal.

Oct 11, 2007
hear, hear!
Oct 12, 2007
Yeah for sure, this NEEDS to happen!
Oct 16, 2007
Oct 17, 2007
add me to the growing group of voices
Oct 19, 2007
i agree wholeheartedly with this request. 

Oct 26, 2007
all my team is waiting this!! :D
Oct 28, 2007
Absolutely, this is a must!
Nov 4, 2007
This would be great
Nov 10, 2007
Yeah bring it on! :)  well done on this app people!
Dec 21, 2007
#15 m.e.siersema
Word! That would be a great feature..
Jan 10, 2008
I think both HTML and CSS changes should be saveable.
Jan 14, 2008
Here are suggestions of what I'd like to see:

CSS - we should be able to save our changes "intelligently" ie. local copies of each
css file that was modified. An option to save as one css file would be a good
compromise initially.

HTML - the webpage being modified should be savable as an html/xhtml file.

We should also have the option of saving css and/or html.

I'd also like to be able to save/export the content of any tab whether upper-level
like Profile or lower level, like Yslow (if you're not using it, you should be).
Jan 17, 2008

I am a free-lance web developer, and came across firebug just recently. I was VERY
impressed with all it's features, it has to be the best editor I have seen yet, and
I've tried out a few. I presently use MS Frontpage as my code editor, primarily
because I've been unable to find a similar editor that is stable on windows and has
the split preview/source view. If FireBug had a simple file save feature, doesn't
need any ftp/cms or upload capabilities, just a simple 'save file' feature to save
any changes  made I would prefer it over MS Frontpage.
Jan 23, 2008
@jccwinters: if you want to actually CREATE pages in Firefox (interesting idea) you
can use Chris Pederick's Web Developer Add-on for Firefox
( and use "Edit HTML" in Miscellaneous
and then click the save button to save a page. You can even edit the CSS and save
that too. I haven't tested it, but I can only assume you can edit the HTML and CSS in
firebug and then use Wed Developer toolbar to save the HTML and CSS independently.

Obviously this would be a good feature (specifically the CSS diffs!) in Firebug, but
until it's in you can do it this way. Having said that, for me, having both Firebug
and Web Dev toolbar running on JS-intensive sites kinda makes Firefox grind to a halt
at times...
Feb 19, 2008
I prefer Firebug to my other editors. Including the Wed Developer Extension. 

I guess it would be a bit complex as you really need to open the source and not what
the server delivers.

Still it's a logical extension to a great product.
Mar 14, 2008
Mar 18, 2008
It's a big time saver when testing local files with FireBug, edit & save immediately!

Apr 2, 2008
This is fanstatic I hope the creator of Firebug is reading this! Update Firebug PLEASE!
Apr 25, 2008
Another one who will donate $$$ to the person that can make Firebug able to save the
changes!!! This feature will be awsome!!!! Even of course in local files...
Jun 7, 2008
Please Add some sort apply/save changes. 
Jun 13, 2008
I just spent fifteen minutes trying to find any way of merely copying the modified
css out. I would settle for that.

The ability to do so may exist, but I can't find it. Yes please!
Jun 19, 2008
DO IT! I could really do with a local copy of the CSS file so I can upload it later!
Jul 21, 2008
A "save changes" or "export changes" functionality would be awesome!
Jul 30, 2008
Firebug for President! Lets all vote yes!
Jul 30, 2008
Aug 11, 2008
Aug 13, 2008
Aug 14, 2008
i would love this.
Aug 16, 2008
go for it boys!

Aug 25, 2008
Been wanting this feature for a while now for basically exactly the same reasons in
the original post.
Aug 26, 2008
Hi people, this is why I did

Setup xrefresh, pick CSS editor of your choice and be happy!
Aug 26, 2008
Sorry, xrefresh doesn't even come _close_ to offering the functionality that's
requested in this issue.

The (desired) workflow is:
1.  Load site
2.  Make changes to the live CSS in Firebug
3.  Cause Firebug to save these changes somehow, somewhere.
Aug 26, 2008
Well, I don't want to spam this thread to do promo for my util. This is my last response here, I promise :)

XRefresh monitor has "secret" feature "fast CSS replace". It means it will not do full refresh, but just send 
modified CSS bits over network into firebug and xrefresh extension then overrides CSS rules inside current 
page (more info:

If you have 2 monitors (or wide one with right window layout). You are able to achieve similar CSS prototyping 
experience like in firebug. You only need to save CSS file after every change in your editor to see the effect. 
But we webdevelopers all have CTRL+S tick, don't we? .-)

I have had similar idea year ago, to generate some patches and apply them back to sources (HTML and CSS). 
But I realized this solution will be problematic if i really don't go back to original sources lying somewhere on 
local machine and push the changes opposite way through whole server stack. Content delivered into browser 
is very often generated and there is no obvious way how to apply them back to sources. At least you need to 
setup mapping between urls and files. And what more! Consider templating engines like haml or sass. Or 
even fully generated HTML say PHP or ASP.

Sep 1, 2008
+1 sería maravilloso! (it would be awesome?)
Sep 3, 2008
I concur, this is ridiculous, Firebug is worth nothing without this, you MIGHT AS
WELLS NOT USE IT. Please add save.

Sep 19, 2008

A plain text file of the affected rules and their selectors would already be awesome!
Oct 5, 2008
+1 Save function would be great. Could be greater than other css software.
Oct 8, 2008
Add me to the list of "really want this feature to work" folks. Thanks.
Oct 17, 2008
Add me to the list - I would donate $ to get this feature.
Oct 18, 2008
Oct 21, 2008
Nov 8, 2008
This is the only feature that sets the application apart for the rest. 
Nov 15, 2008

Nov 15, 2008

Nov 17, 2008
Nov 18, 2008
Yes Please
Nov 24, 2008
Project Member #53
(No comment was entered for this change.)
Labels: css 1.4
Nov 25, 2008
Definatelly needed
Nov 28, 2008
Would be a life saver
Dec 3, 2008
So - what's the status right now - is money being raised for this? If so, where can
we donate?
Dec 4, 2008
The creators of this "Awesome Plugin" must be idiots... because there is no such
thing as a good "editor" that doesn't SAVE. Firebug does not have to be able to save
directly to the server you are looking at, but to simply save CSS changes to a local
file on your computer would do wonders. If Firebug can track the changes as you make
them, then it should be able to track the changes to the appropriate CSS files and
save copies locally so you can FTP them wherever they need to go.

Stop braggin on this gay plugin that lets you make changes quickly... only to have to
go make them AGAIN in another EDITOR... THAT SAVES!!!!!!!!!!!!!!!!!!!!!

PS - Notice this is a feature requested OVER A YEAR AGO!!!! ROFL...
Dec 4, 2008
Project Member #58
The clever and thoughtful comments by walterjohnson1234 are an inspiration to us all.
Dec 9, 2008
I would love this feature.  I just got done making a bunch of changes to a page to
get it how I liked, and now that I've decided I like the look, I have to go through
and figure it all out again from scratch as I can't save it.  ANY method of saving
would be great, I'm not so picky on what that is.
Dec 11, 2008
I vote for this too
Jan 16, 2009
good feature ;)
Jan 17, 2009
I would *greatly* appreciate having the facility in Firebug to locally save my
experimental HTML & CSS changes, so that I could manually upload the altered file/s
to my web server later. I can't see much merit in having Firebug doing the uploading
to the server, but I wonder what others feel? Maybe there's an FTP login module that
could be appended some day?! (Future dreams)

PLEEEEASE make it happen!!! Firebug is the closest I've ever got to WYSIWYG template

Meanwhile, top marks for crafting a killer app that has massively reduced my
development hassles, even if I can't save my changes at the moment. May good things
happen to you.

Jan 24, 2009
hah hah ive been wasting time looking for the save export update feature - should
have been in big letters : YOU CANNOT SAVE EDITS YET!
Feb 3, 2009
has anyone looked at the "scrapbook" extension for firefox? it will allow you to save
your edits exactly how they are after you use firebug. it integrates very well.
Feb 17, 2009
#68 broofa
First, a quick shout-out to all the Firebug developers.  'Great tool, keep up the
awesome work!

I agree that there's a real need for a way to save the ad-hoc changes that are made
to stylesheets in the HTML tab. However I don't know that the proposed "patch"
solution is the right way to go.  I think the underlying problem that makes this
problematic is that Firebug doesn't currently know how to map a URL for a stylesheet
to a local file where the changes should be saved.  So how about providing a
"URL-to-local-file configurator" capability?  Maybe give Firebug a preferences panel
that allows developers to set up regex rules for mapping URLs to their local filesystem?

For example, a rule like the following could be used to map a URL like to the
/Users/someuser/siteroot/stylesheets/main.css file:

(I'm using "|" as the regexp separator to make this a bit easier to read.  You get
the idea.)

With something like this in place, I would hope this capability would be easier to

Hmm... this opens up another interesting possibility.  If Firebug is able to map a
stylesheet to a local file, would it be possible to have it monitor that file for
changes and automatically reload the stylesheet if an edit is made?  I'm sure there
are reasons why that's not easy to do, but I'm just free-thinking at this point.

It'd be nice if Firebug had better project integration features in general - i.e.
ways to update the source files from which a site is constructed, and update the
rendered content of a page if/when those source files are modified.

Anyhow, thanks again for the great tool.
Feb 17, 2009
Project Member #69
Regarding comment 68: the issue here is how to save changes made to CSS in Firebug,
not how to respond to changes in source files.  Even if we knew the file mapping for
every URL that does not help since the challenge here is that the style changes made
by Firebug are not made to the source files. The live browser objects are changed. In
some cases the live object will have a URL that correctly relates to a source file.
Other times not.
Feb 18, 2009
on a scale to 1-10 this is one hundred.
Feb 18, 2009
I really need this feature!
Feb 19, 2009
At least, it would be nice to have a panel that lists all changes made in CSS and HTML.
Feb 20, 2009
#73 isofifty
there needs to be a way to save changes to a local file or, at the very least,
copy/paste ALL css code from the window so it can just be blanket pasted over
everything in the existing stylesheet.
Feb 22, 2009
"Save changes" or "export changes" functionality would be perfect!
Mar 6, 2009
#75 vlad.nedelcu
This is a must!
Apr 10, 2009
Tool is perfect, just add this feature and make it legendary!
Apr 13, 2009
I agree, this function should be added! Many developer will appreciate it ;)

May 16, 2009
If firebug implements this thing with great quality it will be a competitor to web
development ide's
May 28, 2009
We´ll love Firebug more if we can save the changes with it.
May 29, 2009
Project Member #82
This feature should be part of Firediff extension developed by excellent kpdecker.
See also,
Cc: kpdecker
Jun 10, 2009
Yes this would be an awesome, awesome feature
Jul 4, 2009
We need it!!
Jul 8, 2009
Is anyone concerned about site security? Or am I just naive? Think of the chaos that 
could happen if anyone could go to a site, open Firebug (GREAT tool, by the way!!!), 
make and save canges to any website. I can think of a few competitors who might 
actually like that!

Anyway, just a thought...

Jul 8, 2009
Project Member #87
Firebug editing is all on the browser; it does not change the website.
Jul 8, 2009
Project Member #88 robmcampbell
right. The intent of this bug is to save changes to your local machine, not on the
Jul 8, 2009
@dgaletar Not only is it not the intent of this patch but I'm sure it's not possible
without having the proper write permissions on the server.

However, I don't think it would be too hard to generate a new html file from the DOM
and have the file download like any other file.
Jul 9, 2009
So, what if I do my changes on the server, like I do. If you go to a website, any 
website, and change the code in Firebug, it changes it on the page. Until you 
refresh it, anyway. So, if these developers add this much requested feature, what 
would keep someone from doing just that, making a change on the server. In other 
words, how would Firebug know that this was a website that you have the permission 
to change?

I hope that I am not making more of this than I should be. I am fairly new to all of 
this, and I use Joomla!. So, it makes a difference to me.

Thanks again for the feedback!!! Have a GREAT day!

Jul 9, 2009
@dgaletar: You make your changes over FTP, then? And you need a password to access
your server. Firebug would need that same password to be able to make any changes.
Web servers are secured against unauthorized edits anyway, for obvious reasons—if a
simple change to Firebug could circumvent that...let's just say it can't.
Jul 9, 2009
@dgaletar: a typical Firebug session goes something like this:

1) You type a URL into Firefox
2) Firefox makes a request to that web server, and downloads the content to
disk/memory on your computer
3) Content is shown in Firefox
4) You interact with the site with Firebug

Any changes you make to the page are made to the version downloaded to your computer,
not to the version on the server.  Firebug doesn't have the capability to send those
changes back to the server.

There does exist technology to edit a site's content from your home machine (WebDAV,
FTP, etc.), but Firebug doesn't currently make use of any of that.  And even if it
did, as @daniels220 says, you'd have to authenticate yourself with the web server
(via a username/password known only to you) before you'd be allowed to make changes.

I don't use Joomla personally, but reading the About page and the Wikipedia article,
it seems to have editing capability built in.  I'm sure there is an authentication
step required before you can edit -- though, the password may be empty, or perhaps
you had Firefox save it for you, so it's less obvious that you're authenticating
before you perform edits.

Suffice it to say that an anonymous user on the public internet cannot use Firebug to
modify your site's content.
Jul 14, 2009
GREAT answers! Thank you all!

Jul 15, 2009
It would be great if it just changed local files.
Jul 30, 2009
Aug 4, 2009
Either way - whether it generated all of the changed CSS, or had in-built
functionality to FTP or synchronise with an FTP client, this is a definite must-have.
Sep 18, 2009
Maybe not a save out feature for now, just a list of changes that you have made so
you can update your own style sheet/html.

This would be really useful.
Sep 18, 2009
Project Member #98 kpdecker

Firediff offers the list of changes functionality that you are looking for.

The goal of the next Firediff release is to offer the patch creation request that the
whole bug is requesting.
Sep 24, 2009
I would recommend saving your changes the way stylish does it:

In that way you can experiment real time with different solutions and save them into
named templates which you can turn on and off on relevant pages or on a whole domain
Sep 24, 2009
>gearlooze Stylish's "write new style" is very interesting feature. A great thing would be this feature integrated in 
firebug, mean you edit your css with firebug then you save your changes as a stylish new style... Do you know a 
such integration for firebug + stylish?
Oct 14, 2009
Great idea, I'll be happy to help test anything along the way, don't know XUL (yet)
so not sure I can offer much assistance building it in the beginning
Oct 15, 2009
I concur. I would likely just ditch dreamweaver entirely if such a feature exist. It
would definitely authenticate the "Web Development Evolved" motto a lot.
Oct 30, 2009
why not do ?
Nov 23, 2009
That thing would be nice
Nov 26, 2009
Saving to a new file instead of patching would be ok too
Dec 1, 2009
This would be awesome, really something i'd be wanting for a long time now.
Dec 9, 2009
Oh yes, this little thing would take firebug to the next level. 
Dec 10, 2009
Have a look at this:

Saves changes made to css files to any (prior registered) server. Consists of a
firebug extension (firefile) and a server-side webservice script (single file php

read the docs at
Mar 2, 2010
+1 I often develop web applications with my own computer working as a server. It
would be nice to have an option to select local file-system path for css file and
allow firebug to update it.
Apr 19, 2010

first of all, thanks for providing Firebug, awesomest tool until now I use in web

I know a feature like CSS saving is not simple, and may causes issues because,
Firefox interprets the CSS sheets:
-it means your sheet's indenting and comments are not loaded, and can't be exported
-And then, some rules are ignored, particularly the IE fixes(but it apply to all
specific browsers tweaks). So these rules will be lost while exported.
-Rules can be altered via scripts.

Then, the following proposals would still be very helpful and less tedious I think:
-Adding a extra menu when right-clicking on css rules: "Copy the whole CSS rule".
(currently, text-selections in CSS panel are very disturing[using Windows])
-Provide an history of css changes made on rules.
May 4, 2010
Project Member #113 kpdecker

Firediff implements the history functionality that you are requesting as well as attempts to implement the save 

Future versions of Firediff may also attempt to address some of these other issues as well pending some work 
that I am currently working on.
Jun 25, 2010
Since all the features mentioned here are either already part of FireDiff or thinks, that should be implemented there, I changed the labels.
Labels: -Priority-Medium -css -1.4 FireDiff 1.0
Jun 29, 2010
(No comment was entered for this change.)
Status: Triaged
Sep 30, 2010
Project Member #116
 Issue 3488  has been merged into this issue.
Nov 30, 2010
Project Member #117 kpdecker
Changing to commit as all of the issues in here should be handled by Firebug 1.6 + Firediff 1.1. Any additional requests or issues with the functionality should be filed as separate issues so they can be properly tracked.
Status: Commit
Owner: kpdecker
Jan 5, 2011
I'm setting this to fixed now, because - as Kevin already mentioned - all changes are included in Firediff 1.1.
Status: Fixed
Sign in to add a comment

Powered by Google Project Hosting