FortAwesome / Font-Awesome

The iconic SVG, font, and CSS toolkit
https://fontawesome.com
Other
73.32k stars 12.19k forks source link

Icon Request: All icons can knockout #3192

Open jerimiahmilton opened 10 years ago

jerimiahmilton commented 10 years ago

I don't know if this is possible, I have been attempting to create it on my own, but my limited knowledge of SVG is really getting in the way.

It would be a nifty feature to have the ability to have the icons "knockout" any color from icons stacked below it.

Example: if you were to stack three icons like so on top of a button element and then play with their positions. image

Now there's this ugly white circle, I would really like to just knockout the white circle.

Example: image

I have attempted to achieve this myself, but like I said, my limited knowledge of SVG is making it impossible. Here's a stackoverflow thread I started trying to achieve this.

http://stackoverflow.com/questions/21487790/css-or-svg-text-clip-mask

tagliala commented 10 years ago

@OBCENEIKON AFAIK you can obtain this in .svg, but it's impossible with icon fonts

BTW I will take a look (with svg)

refers to #1181

jerimiahmilton commented 10 years ago

Awesome, thanks! BTW https://github.com/FortAwesome/Font-Awesome/issues/902#issuecomment-35353168 is exactly what I was looking for, I forgot to add an additional circle that had color below the + sign.

tagliala commented 10 years ago

I came up with those:

http://jsfiddle.net/tagliala/d42m5/ http://jsfiddle.net/tagliala/d42m5/2/ http://jsfiddle.net/tagliala/d42m5/3/

I have very limited knowledge of svg, I can't help more than this... and the results suck

If nobody here can help, you could try ask overflow (and let us know)