Icon-color-filter vs filter vs -webkit-filter

Hello,
I am trying to customize my dashboards in HABpanel.
While doing this, i am creating my own widgets, and and looking for a way to change colors when things are clicked, or other events happen.

I have been reading around, and i see 3 directives that are mostly used for this:

icon-color-filter: invert sepia hue-rotate saturate;
filter:invert sepia hue-rotate saturate;
-webkit-filter: invert sepia hue-rotate saturate;

While I have more or less achieved the results I want, I realize I do not understand the difference between those directives, and in which case should I use each one of them. Is there anyone able to explain that to me, or to point me to a good resource on this topic?

Additionally, I find it quite difficult to get the colors i want using invert/sepia/hue-rotate/saturate values. Are there any available tools that can help me calculate these values from the original color and my desired target color? Can these directives be used with RGB/HSV, etc instead?

Thanks!