title: css3 grey image to blue color using filters?
body: <p>I'm trying to get a grey image to a more blue tone, really no idea how to set the filters for this or if it's possible.</p>
  
  <p>The image only has one color in <code>#cacaca</code>, the rest transparent. I'm trying to do some overlay with the same image so that it only highlights those colored parts and not the transparent areas.</p>
  
  <p>Been playing with some of these but not much success, no idea what I'm doing when it comes to colors.</p>
  
  <pre><code>.saturate {-webkit-filter: saturate(3); filter: saturate(3);}
  .grayscale {-webkit-filter: grayscale(100%); filter: grayscale(100%);}
  .contrast {-webkit-filter: contrast(160%); filter: contrast(160%);}
  .brightness {-webkit-filter: brightness(0.25); filter: brightness(0.25);}
  .blur {-webkit-filter: blur(3px); filter: blur(3px);}
  .invert {-webkit-filter: invert(100%); filter: invert(100%);}
  .sepia {-webkit-filter: sepia(100%); filter: sepia(100%);}
  .huerotate {-webkit-filter: hue-rotate(180deg); filter: hue-rotate(180deg);}
  .rss.opacity {-webkit-filter: opacity(50%); filter: opacity(50%);}
  </code></pre>