Introducing FeedIcons.com

I knew while I was working on reproducing the feed icon that some folks would find it useful. I had no idea it would take off as it did! I’m extremely stoked that so many people have embraced it and accepted it as the new standard icon. Feels great knowing that I’ve created something that others can benefit from – all for the sake of a better internet.

feediconsA ton of eyeballs have seen this site in the past 48 hours and that’s rad as hell – but who wants to read some dude’s long-winded article and have to scroll all the way to the bottom of it to download the icon package? Figured that this icon is important enough to give it a proper home. And thus, I present to you feedicons.com.

I’ve replaced the download link on my article with a link to feedicons.com where I’ll continue to support this new standard of ours and encourage others to jump on the bandwagon. I have lots planned for this site and have recruited a couple of my developer friends to help me execute it – I’m utterly hopeless with any kind of scripting language, so I’ll leave all that stuff to them. I’m not going to reveal everything now, but I will tell you that we’re going to create a user submissions gallery. Anyone will be able to upload their own customized icons for others to use on their sites. Not everyone is a designer after all – this will give those who are not able to customize the icons themselves a chance to use a custom icon as well. Lots of other radness is in store, but you’ll have to wait for that. Feel free to subscribe to the announcement list to stay in the loop.

The package on the new site has some new goodies. A couple new formats (EPS and PDF) as well as some pre-saved image formats (PNG, JPG and GIF) are included. An SVG version is on it’s way. I’ve created one and sent it out to a couple people to test before it’s included. There’s also legacy versions of the AI and EPS formats that go back to Illustrator 10. If there are other formats you’d like to see, or sizes for that matter, feel free to suggest them.

I’d like to give a quick shout to those that have already adopted the icon and/or helped to promote it – I’ve seen you in my referrals and greatly appreciate the link love. Thank you! The future’s looking bright for our little orange friend.

And now, I must sleep. Oh sweet slumber… how I’ve missed you!


56 Responses to “Introducing FeedIcons.com”

  1. dude, you're a freak of nature. open a present or something. 😉

    by the way, i mentioned this format on veen's latest post. hopefully measure map switches up.

  2. congrats on the newfound popularity. rethinking that advertising decision yet? 🙂

    btw, rad design on the new site. nice turnaround. good work my friend.

  3. Hey Matt, awesome work as always, will definatly be using them on V3 of my blog.

    Just one little thing, i noticed an error in the display on the download button, in firefox 1.5 i took a screen shot for you

    on closer inspection, i noticed you are using an anchor tag with a non breaking space in it. Could i suggest using a span inside an anchor. with the span having the word Download in it. You can then format the anchor to look like the button, and then hide the nested span using display:none; this method is not screen reader friendly but neither is an empty anchor tag.

    Please don't take offence in me offering this advice, you are in a completly different league to me in terms of design and css. Just my 2 cents.

    Chances are you did it your way for a completly sensiable reason and im missing something entirly!

    Andy.

  4. @sean coon: hah! That literally made me laugh out loud! Thanks for helping spread the word dude. Appreciate it.

    @jason: No sir! I'm sticking to my guns. I decided not to put any ads on feedicons.com either. Mostly because it's not my property and it wouldn't feel right to make money from it. Although, I did toss a donate button on there. Those who feel like tossing me a couple bucks for my time are free to do so. 😉

    @Andy Pearson: Ah, thanks for pointing that out. Your screenshot shows Firefox 1.0.7 – not 1.5, though. What OS are you running? Anyway, there are definitely some aspects of this site (quite a few actually) that are not done quite as well as they should be. This is only because this is a temporary site and I whipped it off within a few hours from start to finish. Moving forward, I will make my best efforts to ensure this site is not only compliant, but accessible as well. In the mean time – I realized I had forgot to set the text-decoration to none on the a tag. That might have fixed it? Looks fine for me on Firefox 1.5 win/mac, IE 6, Opera and Safari.

    @l0ne: Very cool! Thanks for sharing.

    @Per Gaustad: Ironic, isn't it? 😛 As I already mentioned in my reply to Andy – this site is very temporary. I chose an announcement list over feed for the initial launch as this is not the full site. It will be launching in January and will most definitely have a feed… or a few, for that matter.

  5. Hey, its great you have all these formats, how about an SVG file, so those without Adobe Illustrator can use a vector based file?

  6. You're acting like you created the original icon! There is someone involved with the Firefox project that deserves commendation, yet all I see is you taking the credit. In fact your job was the most trivial, creating a vector version of the icon, something that at least two people have done already: someone for Mozilla and someone for Microsoft.

  7. WOW, not sure what to say.

    I read your first post and downloaded the set right away, then the next day you got dugg, and now this.

    Very impressive my friend, very impressive. OH, nice to see you on the top design list of 2005 also. Looks like you are starting 06 in style.

    Keep up the awesome work.

  8. @David: SVG is on it's way. I just heard back from a couple people I asked to test it. Seems that it's good-go-go! Will be uploaded soon.

    @Mark: To quote myself…

    I decided not to put any ads on feedicons.com either. Mostly because it’s not my property and it wouldn’t feel right to make money from it.

    Item number 2 in the readme is Credits…

    Originally designed by Mozilla Foundation for the Firefox browser.

    Adapted by Microsoft.

    Vector version reproduced by Matt Brett (mattbrett.com), December 19, 2005.

    Am I asking people to download this icon I created? Or even to spread the word that I created this icon? No sir! I've made it quite clear that the icon was created by Mozilla, adopted and revised by MS and reproduced by myself. You might want to read the original post as well.

    Might wanna look before you leap next time.

  9. Seems like some folks have misunderstood…

    I guess that happens when things get crazy popular super fast.

    Nice work Matt, and good credit to where it belongs.

    I think that the people that understand what you are doing do not feel that you have taken credit for anything.

    I would LOVE to see your Mint stats on feedicons.com. Thanks for the info on the peepers you talked about last week, very nice indeed.

  10. I ran into this site via del.icio.us today and I really applaud the desire for a standard icon for syndication feeds. I've been talking to my colleagues about this issue and while we all agreed the need for standards are there, we also agreed this is the wrong icon to use.

    If you pull a complete stranger into a room and ask them to give their first thought on what this icon represents, unless they have some background on this subject, it will not be 'syndication feed'. I think this subject needs to be thought through a little more so that a good standard can be found.

    Once again, I'm very happy to see people pushing for standard visual communication, I just think this is a standard that would communicate the wrong message.

  11. the stand alone visual icon in the firefox nav toolbar will probably catch on if we make the right choice of contextual nomenclature when it's used elsewhere.

    on my blog, i used the word "subscribe" next to the icon (instead of the default theme label, "RSS.") even the word "Feed" might be a bit unclear for the newbie.

  12. How quickly did you create that and get it on the web?

    I hope the W3C sees all of your hard work to spread the word about the new standard for Feed icons!

  13. Whee! Downloaded and made myself a… guess… pink icon! Anyway, I just want to suggest that when you're saving .AI and .EPS files, to keep the versions lower. Illustrator 8 version seems to be the standard. I say this as I have Illustrator CS, not CS2, and I wasn't able to load those files.

  14. Great job on the feed icons. What would also be nice is if there were a set of these with the names of the different feed readers on them (like the 'Subscribe to Bloglines' buttons)?

  15. Oh no! I just realized I'm out of luck, nothing for any Macromedia product. I guess being a lowly Fireworks user has it's downside.

    I guess I might aswell go get a copy of Photoshop, I've put it off long enough, although I love Fireworks 10000x more that Photoshop might as well leave it behind as I'm sure Adobe will…

  16. Beautiful site and icons, thanks much for the resource.

    One 'possible' addition…

    Anyway to get a Feed on the FeedIcons site? So i know when you update.

  17. Just to let you know that the .ai file has a little error in it that is easy to correct. A vector image should scale perfectly, however you used strokes for the creation of the two quarter circles. So when you re-size the whole vector the thickness of those two lines does not change and becomes un-proportional. Here is the quick fix: Select the two lines and go to Object -> Path -> Outline stroke.

    This keeps things in much better proportion when scaling the vector. Hope thats helps someone :p Cheers

  18. hey again

    man do i feel silly? can't believe i didn't realise im not on 1.5!!! just as well i included the about dialog so you could spot my idiocy eh?!

    i run 1.5 at work, apperently i never found time to update it here at home. guess i will do it now to save future embarresment!!

    I'm on windows XP (HE) but its all fixed and looking lurvly now, looking forward to the site expanding in the new year, but now its time for you to kick back, have a mince pie and enjoy christmas!!!

    Andy

  19. Umm ya. It seems like your taking this icon alittle too far, it almost seems like you feel you started this revolution of standardization. Lets not forget who really started this…

  20. This is a great effort, which I applaud, and I've added the icons to the Glasgow Explorer site.

    However, I do agree that the chosen graphic isn't necessarily the best for the job – I instantly think of wireless networks when I see the little Airport-esque glyph, and even for the non-technical user, I think the chosen icon would be more likely to evoke 'broadcast' or 'transmit' than 'subscribe'.

    I also have minor reservations about a couple of the examples of colour schemes on the Feed Icons site – the light blue makes the white glyph almost invisible, for example.

    Still, it's good to move away from the shitty XML buttons we've hated for so long – and whatever direction this project moves in, I'm sure it'll be a good one.

  21. I've created a few new variants.

    The first is another SVG icon (created from scratch before the AI->SVG version was added to feed-icon.zip, and before Petr posted above me). It has three advantages over the current icon: web-safer colors; smaller size if you strip out the metadata (SVG 1334 bytes, SVGZ 554 bytes); and more human-readable contents (a huge bonus if you're embedding it into your XHTML webpage, rather than using object/embed/img tags).

    The second is a Microsoft .ICO-format icon (created by rendering my SVG to PNG with Inkscape, then using PNG2ICO). Two variants are provided: a "standard" file (48, 32, 16 @ 8bit color; 32, 16 @ 4bit color), and a "maximum" file (128, 64, 48, 32, 16 @ both 8bit and 4bit color). The "maximum" file is massive (48K) and "standard" is almost always preferred (8.3K).

    You can find the files @ . Hopefully my ISP doesn't burn down…

  22. Thanks these are awsome.

    I am working them into the CMS I am making which is designed for bands, it is called Rock Band CMS and is on sourceforge with the name of rockband. See the website link for more info. It is opensoruce and will credit the feedicon.com site when I post the next release.

  23. Great Work 🙂 Hopefully everybody will start using this icon and stat talking about "feeds" rather than "RSS".

    Now what we really do need is a transparent gif. Any chances of getting one?

  24. Mehdi said "hi, i had make some rollover icon for RSS & Atom (new design) with that ear symbol,see here: http://doxdo.com right bottom no-repeat;"

    I think the idea of roll over buttons is great and would like to hove some 🙂 But the idea of distinguishing between RSS and Atom in the icon is contra productive. The end user of the feed should not have to care which is which. Ive written about this before and i'm sure many others have too.

  25. I'm afraid to see you have created absolutely nothing. All you have done is taken the icon that Firefox uses and Microsoft and Apple have agreed to use, and made a website for it.

    Sure, you've recreated something, but it was not your original idea.

    I believe by making it multi coloured, you are muddying the waters also… It should be ORANGE and that is that…

    Also, if you want to talk about standardisation, spell Customise, Harmonise and Popularise in the correct English way, not American English.

  26. Please don't get me wrong. I applaud the idea of a site to push forward the feed icon standard (even though it would take off on its own anyway, but every bit helps) but its lines like

    "Feels great knowing that I’ve created something that others can benefit from – all for the sake of a better internet."

    that will wind people up. You've recreated something… Someone at Mozilla should smack you in the mouth for that line!

  27. You’re absolutely entitled to your opinion Paul, disagreeing with your point wasn’t the reason for my response. Your literary conduct was.

    And just so you’re aware, I spell realize with a â€ËÅ"z’ as well. I, like Matt, am also Canadian, and learned to spell it that way as a child. In the Gage Canadian Dictionary, it’s spelled with a â€ËÅ"z’. Being that we’re a Commonwealth country, it’s safe to assume that not just Americans employ the letter Z in such a way.

  28. If you talk about standards, things should be written in standard English, or International English, which uses a S instead of a Z.

    and you can't have a standard if you employ multiple colours either.

  29. Because he’s talking about a standard feed icon he has to employ international English? And were he to use Cantonese, would it then be even more laughable an idea? Seriously, give your head a shake.

    As for their colours, the icon itself is more than enough. Allowing for variants means that ugly isn’t the standard, which I’m all for. If there’s one thing the web is about, it’s the organic growth of ideas. Compliance standards, if rigid, only stand to limit creativity and inventiveness, not foster growth in a growth environment.

  30. One thing missing from your PDF is a terms of use. At work we're looking at putting the icon into our products and I've been trying to find an official statements from the Mozilla Foundation, but couldn't find anything.

    We'll probably go right to the Foundation for official permission, like Microsoft, but I was hoping they might have already made a statement so the icon and hopefully your version, can make its way into commercial products.

  31. Hey Matt, thought you might like to know that Michael Heilemann has included your feedicon in the latest version of his K2 WordPress theme. And changes color on hover too. 🙂

  32. Dave Winer dances to a different drummer . When he should be promoting the new feed button to facilitate newbes learning about how the blogosphere works, instead he continues to promote his old crappy XML buttons that are the source of the confusion in the beginning. Dave, get your head out of your ass

  33. Matt, these are awesome, love working with them, but is there any chance you (or someone else reading this) could give me a hint on how to change the colours using the Gimp. Your readme for photoshop worked a treat but I only have the trial version of photoshop and it will have to go once the trial runs out.

    Cheers

    Carl

  34. To Carl and anyone else asking about changing the color with Gimp:

    I needed a custom RSS icon for one of my sites (seclists.org) and my first approach was Googling, and I couldn't find any hints. So I experimented a bit and found a way that seems to work. First, openthe (PSD format) grayscale file of the appropriate size in the Gimp. Then right click on the image and choose Filters — Colors — Map — Map Color Range. For the source, choose #727272 (the darkest color on the grayscale feed image) to #FFFFFF. For the destination, choose from your desired color to #FFFFFF. Thn hit OK. There are probably easier/better ways, but this worked fine for me. I hope it helps. -Fyodor