Is there a property that changes an icon fill color

[JackPollack]

I want to assign a filled in dark star icon to one of my buttons.
When I point the button icon to

Code: Select all

image: url("chrome://browser/skin/Toolbar.png") !important;
  -moz-image-region: rect(0px, 162px, 18px, 144px);}

it is giving me a BLUE filled in star like the bookmark even though the Toolbar.png resource appears to be black (the icon is black when it is in the menu hamburger).

Is there a property of a style that sets the icon fill color or a black version of the filled star in another resource?

Thanks

[Frank Lion]

I want to assign a filled in dark star icon to one of my buttons.
When I point the button icon to

Code: Select all

image: url("chrome://browser/skin/Toolbar.png") !important;
  -moz-image-region: rect(0px, 162px, 18px, 144px);}

it is giving me a BLUE filled in star like the bookmark even though the Toolbar.png resource appears to be black (the icon is black when it is in the menu hamburger).

Is there a property of a style that sets the icon fill color or a black version of the filled star in another resource?

Thanks

You want menuPanel.png, but those are 32x32's in there. You can use transform: scale to resize them though.

You could keep what you've got and put a SVG filter on it, like this - filter: saturate(30%) !important; or greyscale it, with this - filter: grayscale(50%) !important; then just change % figures to suit.

To darken to black (which I can do) is outside the remit of the stock filters and needs special coding for.

[dickvl]

I you want to experiment with filters, see:
https://developer.mozilla.org/en-US/doc ... SS_filters
(you can open the image in a tab to be able to use the Inspector)