The New Firefox Icon

Later this week we will be shipping the first Release Candidate build of Firefox 3.5, which is currently in the process of being evaluated by our exceptional QA team and testing community. This also means that we are now ready to finalize the design of the new Firefox icon.

I want to thank everyone who provided feedback on the icon during the design process. But more importantly I want to thank the new icon’s creator Anthony Piraino from the Iconfactory. He did a great job with the design work, he very quickly adapted iterations as we changed our direction and sent feedback, and he wasn’t the slightest bit fazed by a completely transparent process that designers often find to be a bit uncomfortable.

The updated Firefox icon is based on sketches and conceptual artwork by Jon Hicks and Stephen Horlander. It is also of course an evolution of the previous rendering of the Firefox icon which was created by Jon Hicks, based on a sketch by Stephen DesRoches and the creative direction of Daniel Burka and Steven Garrity. More information about the history of the Firefox icon is available in our creative brief. All of the designers on Mozilla’s original visual identity team provided feedback on this update, along with Mike Beltzner, Asa Dotzler, John Slater, Paul Kim, Tara Shahian, Alexander Limi, Jennifer Boriss, and the broader Mozilla community.

Files for the new Firefox icon are below, as well as on wiki.mozilla.org.

Download everything (2.9 MB)

Shadow

16×16

Firefox-16

22×22

Firefox-22

24×24

Firefox-24

32×32

Firefox-32

48×48

Firefox-48

64×64

Firefox-64

128×128

Firefox-128

256×256

Firefox-256

512×512

Firefox-512

No Shadow

16×16

Firefox-16-Noshadow

22×22

Firefox-22-Noshadow

24×24

Firefox-24-Noshadow

32×32

Firefox-32-Noshadow

48×48

Firefox-48-Noshadow

64×64

Firefox-64-Noshadow

128×128

Firefox-128-Noshadow

256×256

Firefox-256-Noshadow

512×512

Firefox-512-Noshadow

Icon Files

Windows ico
OS X icns
(Linux: just packages individual png files)

Favicon (to replace an ico)
Favicon (to replace a png)

PSD grid with all pixel polished resolutions

Word Marks

Logo + word mark vertical
Logo + word mark horizontal
Word mark

Vector Files

We will also be releasing vector files for the new Firefox icon (to help with crop circle planning, etc). However we need to finalize a license agreement to accompany them (please do not sell unauthorized physical copies of Firefox with nice box art). We should have those files ready soon.

More information about the project can be found in these earlier posts:

5/06/09 – Thinking about Refreshing the Firefox Icon
5/14/09 – Evolving a Product Brand
5/15/09 – Creative Brief for the New Firefox Icon
5/15/09 – New Firefox Icon: Iteration 1
5/15/09 – New Firefox Icon: Iteration 2
5/17/09 – New Firefox Icon: Concept Rendering by Stephen Horlander
5/20/09 – New Firefox Icon: Q&A
5/20/09 – New Firefox Icon: Iteration 4 + Modified Creative Direction
5/20/09 – New Firefox Icon: Iteration 5
5/21/09 – New Firefox Icon: Q&A, Mostly about Orange Juice
5/22/09 – New Firefox Icon: Iteration 6
5/22/09 – New Firefox Icon: Iteration 7
5/26/09 – New Firefox Icon: Iterations 8 and 9
5/28/09 – New Firefox Icon: Iteration 10
5/30/09 – New Firefox Icon: Iteration 10 in Context
6/02/09 – New Firefox Icon: Iterations 11 to 14
6/06/09 – New Firefox Icon: Iteration 14 in Context
6/17/09 – New Firefox Icon: Q&A

Tags:

100 comments

  1. At second sight looks better.

    Awesome ;d .

  2. Honestly, I don’t like it. At least in the 16px version on my taskbar it just looks like someone ramped the contrast up.

  3. I agree with Freed, the 16 x 16 px are too dark in my Vista task bar.

  4. Good work! Looks great.

  5. I’ve got to echo the 16×16 comments. Looks out of place on both XP and Vista IMO.

  6. I know it’s a much lower priority, but will other related icons be updated? For example, the unbranded globe, the Minefield icon, and the Software Updater icon.

  7. Nice! Those will fit great on a Linux desktop.

  8. I agree with the comments above, the 16 x 16 px icon doesn’t work. Anthony tried to stuff in too much detail for 16 x 16 px. Good idea in theory, but the result is pretty awful.

    I think the worst part is the outline of the ears pointing straight up that is specific to the 16×16 version.

  9. Have to agree with everyone else, the 16×16 looks too cartoony in comparison to the old one – less subtle, higher contrast. Not really a fan, sorry.

  10. I agree with other comments. 16×16 icon just looks ugly, too flat and even beveled inwards. I made a quick 16×16 version how I think it should look like:

    http://img193.imageshack.us/img193/6483/firefox16x16.png

  11. Guys,
    As you still haven’t released vector, could you please make a 2000×2000 version for me?

  12. Now that the icon is finalized you should do a “history of Firefox icons”, and compare the FF icon from 1.x, 2.x, 3.0, and now 3.5

  13. The new icon looks really nice, except for the 16×16 icon. I don’t like the dark outline of the fox in the centre, it eats away almost all of the globe, and looks ugly.

    Even Zarro Boogs icon looks better, trough he took to much of the outline away from the (left) outside of the fox.

    ps. did my previous commend get trough? It was the same as this one, but i realize now 7+4 is not necessary 13 :D

  14. I agree with a few posters above, it looks great in the larger, high-resolution versions, but in the sizes that will actually be seen 99% of the time as the icons on user’s computers, it looks terrible. It looks over-saturated and blown (highlights that is). I think there needs to be some serious thought put into adjusting the smaller versions for contrast and saturation.

  15. I agree with the comments above. The 16×16 version looks too dark.

  16. Im still using V 2 of Firefox, 3.0 keeps hanging up on multiple tabs and is VERY annoying. I hope 3.5 fixes these issues!

    Riff
    http://www.anonymity.tk

  17. I can’t wait for the new release!

  18. It might look dark in Vista, but it looks fantastic in Windows 7. The darker border makes it much more obvious what the icon actually represents. The fox inside is lighter too, so I really don’t think the darkness is an issue at all. Good job!

  19. 16×16 icon. When I saw it on this blog for the first time, it looked ugly for me. Because on the old icon Fox was Orange, and Globe was Dark-Blue. On the new icon, Fox is more RED, and the globe is more LIGHT-BLUE. But I have updated Firefox last night from 3.5b99 to 3.5rc1 (with new icon), and I quickly got accustomed to new 16c16 icon.

    Great job! :) But what about Thunderbird icon? Will it be updated too? Please! :)

  20. 16×16 is HORRIBLE. i was shocked to see this when i updated to RC1 today. can’t you just keep the old 16×16 and just update the larger icons?
    old 16×16 was WAY subtler and had better contrast & saturation.

    oh and maybe add a before and after javascript page (hovering over image gives us the new icon) so that we can see the changes? i still don’t really understand why you had to touch up the icon & i don’t really see any big changes so far – except in 16×16 =(

  21. Am I missing something? It doesn’t look any different…

  22. I agree at the 16×16 comments.
    Also the 128×128 (and maybe upwards) image seems to have bad alpha – i have rklauncher (an os x dock clone) running on windows xp and there are a lot of black pixels in an area of the icon (boundaries and below the shadow) that should be transparent.

  23. Can we see the old icon for a side by side comparison?

  24. I can’t believe this is such a big deal. The new icon has a touch more gloss to the globe and the fox is slightly darker orange. Whoopee. It’s just an icon, it’s nearly identical to the old one and looks weird at the small (mostly used) sizes.

    Anticlimactic.

  25. I think the 16 pixel version looks really good! It complies with Apple’s HIG guidelines for drawing icons, rather than scaling it down it should be redrawn at the correct size cause of this it looks fantastic. The problem everyone is having is that the task bar in Vista is really dark, it looks amazing in my Finder and on my Desktop.

    Observe.
    http://localhostr.com/files/e2e4b3/Picture+1.png

  26. The word is fazed as in discomposed, not phased as in sequenced.

  27. I’m going to have to agree on the 16×16 icon; too much contrast. It would look fine as an icon on a website, but it looks weird on Windows. (Like in the taskbar)

  28. Wow, these FF icons look exactly the same as FF 3.0 which I have had for a while. Unless I changed the icon as I like doing that once in a while. But honestly, how do you guys find it different, it looks exactly the same as 3.0!!!!!!!!!!!!!

  29. With the shadow looks much better.

  30. Wait, I have seen a side by side comparison and it is different but not a break through or something, its just been touched up a bit. Please, the icons on deviant art are way more vivid and have more depth to them.

    Comparison
    OLD:
    http://img361.imageshack.us/img361/9092/firefoxjp7.png

    NEW:
    http://people.mozilla.com/~faaborg/files/shiretoko/firefoxIcon/firefox-512.png

  31. Hi,

    Just noticed that in FF3 at least your header is out 1px to the right. Can i have a job?

    16×16 px icons is lackin a bit but the rest is greatish.

  32. 16px version is too orange, like everyone else said.

  33. I don’t like the way the icon looks, kinda darker…

  34. Perfect for everything except the 16×16 icon.

    Surprisingly, this most disregarded version is the only one 90% of Windows XP users (over half of the world market) will ever see.

    Even the original 16×16 looks better, as well as Zarro Boogs’ half-ass rendering in post #11.

    The current rendering is complete shit (pardon my language, but look at the outcry here). The colors are almost completely wrong. It’s one half dark orange, one third black-brown, and maybe 20 pixels of blue, yellow-orange and white combined. The huge head suffocates the rest of the icon, and isn’t near the shape of the bigger icons, killing any notion of consistency. Its think brown outline looks like an ugly cartoon and in no way matches the larger renderings, and even breaches compliance with the stated goals of making this new icon more modern and realistic. WTF?

    I know all this has been said dozens of times not only on this post but a bunch of others too, and the only reason I restate it is because all the voices in unison so far apparently haven’t been enough for them to even look at changing it. So I’ll join the crowd in shouting:

    PLEASE FIX 16×16, IT IS SPOILING THE WHOLE SET.

  35. For comparison (I had to look side-by-side to really appreciate it), here’s the old one (with shadow):
    http://home.vrweb.de/~martin.lallinger/Firefox_Logo_512x512.png

    And the new one again (same size):
    http://people.mozilla.com/~faaborg/files/shiretoko/firefoxIcon/firefox-512.png

  36. At least the 16px version is significantly darker/redder than prior versions. The lighter orange hues used previously were more pleasing.

  37. Logo looks good (except at 16px). In addition, the top of the image looks weird – like the designer made a mistake or something. See link:

    http://img41.imageshack.us/i/firefox512noshadow.png/

  38. I’m surprised no mention is made of Jon Hicks (http://www.hicksdesign.co.uk/journal/branding-firefox) who designed the original logo. This is basically a more detailed version of that. Not to take away from the work that went into, but I think that should be stated somewhere.

  39. The 16×16 looks great on my Mac. Maybe this thing needs a color profile so it can look good on Windows too? Gamma 1.8 to 2.2 is a big difference.

  40. I especially love the 16×16 icon : the head is distinguishable, and colours are great.

    In fact, that’s a good point, because on Windows, this is the one with which we have the more contacts.

    Congrats to all the team !

  41. Hasn’t this icon been in use for a while now on various linux distros?

  42. Nice! Those will fit great on a Linux desktop..

  43. “please do not sell physical copies of Firefox with nice box art”

    Why on earth not? There’s nothing wrong with selling Firefox (ask Gervase about a rather amusing blog post he wrote about this) – so why prevent people printing nice boxes etc?

  44. 16×16 icon is horrible. Please, do not let firefox 3.5 be released with this icon.

  45. I’d like the 512×512 one, right in the middle of my desktop. that’d look awesome.

    Well, they-re great. congrats.

  46. First of all, the icon creator is John Hicks. The second guy only gave it a more pointy tail and screwed up the smaller versions of the icon. Might want to rethink that one, guys.

  47. Wow. How this post gets written without mentioning Hicks is beyond me. Surely just an oversight, right Alex? Iconfactory is good at what they do, but I’m sure even they would be embarrassed to have praise heaped on them for touching up someone else’s work.

  48. I love the new icon. Looks sharp and great contrast. Well done!

  49. I like it except the 16×16. It looks out of place compared with my other icons- like it is from an old piece of software with 8 bit colour icons.

  50. Is it possible to get big Firefox 1.0 logo somewhere (for comparison)?

  51. The word is fazed as in discomposed, not phased as in sequenced.

    Ok I feel dumb, updated.

    I’m surprised no mention is made of Jon Hicks

    I updated the post with a complete set of credits. If you read this post as the last one in a sequence of 19 posts (where Jon Hicks is mentioned repeatedly) the omission is less egregious. But a lot of people are now arriving from digg, and reading this post in isolation, so yeah, I should have had the full credits listed.

    “please do not sell physical copies of Firefox with nice box art”

    Why on earth not? There’s nothing wrong with selling Firefox (ask Gervase about a rather amusing blog post he wrote about this) – so why prevent people printing nice boxes etc?

    Comment was meant as a humorous example of the fastest path to losing control of our trademark. I switched to “unauthorized physical copies” (since Linux distributions do indeed sell Firefox in a box, and that is great), but I’m still waiting for more information on what the actual policy is.

  52. So that’s 5 positive comments about the 16×16 icon and 20 critical ones. Also, the positive comments all directly reference OS X or Windows 7 (while the negative comments focus on XP and Vista).

    We can look into trying a few more revisions on the 16×16 icon, but the main problem is that the release candidate is frozen, so for us to be able to land a new 16×16 icon there would need to be some other significant problem that forced the creation of a new release candidate.

  53. hy
    i’v beuty icon 64*64 IS THE best!!! GOOD LUCKY

  54. @Joseph Godfrey – You have got to be kidding.

  55. 16×16 is dark and Ugly.

  56. I really like the large images, but the contrast and roughness of the small icons is not an improvement over the Firefox 3.0 icons. FF icon makes for fashionable merchandise.

  57. Alex, is there any chance that we will see these changes carry over into the unbranded globe icon usually used for nightly and unbranded builds?

  58. I like 16×16: Fox has clear head shape (versus current icon, which is blurry), but on 22×22-32×32 tail (right bottom part) looks like circular saw…

  59. I’m honestly the last person to ever comment on someone’s blog.

    The 16×16 icon is driving me mad. I could probably use a resource editor to replace it, but I’d end up having to do that with every update of Firefox.

    The guy with the OSX icon is right. It doesn’t look bad alongside his other icons. I’m guessing the designer made it on Apple.

    On Windows it looks completely out of place. This is amplified by using the Windows Classic theme. Here’s a picture for reference:

    http://img230.imageshack.us/img230/7269/fficon.png

    The old tray icon blends in as it should. The strong red outline is what’s killing the new one. There isn’t a single other icon on my system that has a non-grey outline. If you bump down on the contrast of the outline it looks much less foreign in XP. See my minor tweak on the right.

    Please fix this or revert to the old icon before release.

  60. Tanto rollo, practicamente está igual.

    Inviertan el tiempo en otra cosa.

  61. Well, from a design stand point: as an icon, it is WAY overworked.
    Too much detail where less would be better.
    The globe edges in the bottom right break up the design for no reason.

    The 16x16px icon looks awful on vista, and XP (probably Windows & as well) – scaling the larger size icon down rarely ever works.
    http://i41.tinypic.com/xomyck.jpg

    The final version should keep the older icons for those with a decent grasp of design. Why mess with a classic.

  62. 16 x 16 icon was the first thing I noticed on the RC. Really don’t like it, though the new logo itself is fine. The head outline bugs me the most, plus it’s just too cartoony looking and over saturated. Much less professional than the old one.

    I can’t look at it without instantly vomiting.

  63. IMO, the new 16×16 looks much nicer than the old one. It even looks like a fox now. Impressive!

  64. Please go back to the old 16×16 icon, the new one is way too intense. :(

  65. The new 16×16 icon is oversaturated. It was orange, and now it is red. Just make it a bit softer, and add some yellow, please!

  66. The earth? the land mass? why is it just one big land? and it looks like a figure of some sort… please explain.

  67. Add another negative vote for the 16×16 icon, on both XP and Windows 7. Frankly, I would consider this important enough to justify another RC itself. The 16×16 is going to be seen by practically everyone on Windows – it NEEDS to be right.

  68. Got my 3.5rc2 and I agree, 16×16 is way too dark

  69. In 16×16 the new logo is uglier than the old one. But the larger ones are great!

  70. The more I use Firefox 3.5, and the more I look at the new 16px icon in my quick launch tray next to the old 3.0 icon, the more I’m amazed at how great it looks. The old icon was pretty bad, but I figured that there was just too much detail to depict in that small of an icon. You guys did it though. Absolutely fantastic work, bravo!

  71. The new Firefox icons fit in great with the new Windows 7 icon set – great job!

    And for those of you who dislike the 16×16 (I personally think it makes a refreshing change) can just use something like ResHacker (http://www.angusj.com/resourcehacker/) to replace it with the one from Firefox 3.0.

  72. Alejandro Moreno

    I installed 3.5 yesterday and the icon on the XP taskbar and QuickLaunch bar just jumped at me.
    I *love* it.

  73. 16*16 is very bad in XP.
    and unfortunately it is at 3 places at the same time (quick launch, task bar, top of each window)
    for god’s sake, please change it. I beg you.

  74. Folks, stop flaming, because 16×16 icon was UPDATED recently, in Firefox 3.5 RC3 :)

  75. The 16×16 icon in the new RC is much nicer… better than the old one too. Good job :)

  76. I have combined all Firefox icon drafts iterations (and final icons as well) together for easy comparison. (Accurate image resizing took many hours!) Download:
    http://sla80.wordpress.com/2009/06/28/firefox-icon-drafts-collection-combined/

  77. XP users running in Classic mode complaining about the look of an icon? Are you fucking serious? Your whole OS looks like ass — that little 16px icon should be the least of your worries if you’re concerned with the look and feel of your work environment.

    Absolutely stunning work by Anthony. Great attention to detail and color palette. I’d be careful if you’re thinking about changing the icon based on the whims of users who are still running a 10 year old OS. Not all advice is good advice — most of it isn’t.

  78. I think I agree on the contrast/darkness issue. On Mac, firefox is way darker than everything else. Looks a bit out of place. As much as I like the bold look of the fur, it just doesn’t fit in. The new tail is refreshing though, now that I’m used to it.

  79. Looks bright and beautiful on my Mac OS X dock and even better when command-tabbing between open applications.

    The latter is where I noticed it after I upgraded today which along with a Google search resulted in my being led here.

  80. I think it’s too shiny. Shinier than all the other icons on my mac. This disturbs me a bit.

  81. Martin, how does it scare you?

    Where can I get in 4096 high resolution? You should post larger pictures.

    It looks pretty good. I’m used to the old one, shouldn’t take long to get used to this one. I see it has a lot more detail. Looks more lively.

    ~Midna

  82. what was wrong with the previous one??

    The specular highlight on the globe is _very_ distracting in the Mac dock, and just plain looks funny. Globes aren’t made of glass….

  83. Snowflake Seven

    The 3.5 final release has been out awhile and every time I see the icon in my Dock it looks terrible. Its over-saturated and blown-out. It looks less professional and more like an amateur theme designers attempt to tweak it to match some half ass Audion theme from 1999. The super large sizes (128 and bigger) are so-so. But the smaller sizes are hideous.

  84. like all the other people the smallest icon in the quicklanch looks weird. the dark outline in the head of the fox looks weird. otherwise its good at least when its larger.

  85. I sent a link for a song to a person and I was horrified to see that every site most visited was included with password saved links that include very personal information. Firefox has a very serious security problem here. Beware! I have no idea how this happened in software that is supposed to be safe. I now need to change passwords that have been breached by what I consider to be a major security problem with Firefox.

  86. I agree with some that it is a bit dark for XP and Vista but in Windows 7 It is so much clearer and it just looks better with everything else. Also, as with many things, the icon eventually needed a facelift and it got a pretty good one!

  87. Wooooow. Awesome Work. I like it a lot!

  88. Firefox Sucks!

  89. Hi Chris, I would want to translate this article to the Russian language. Please tell me your email, simply reply to my mail. Thanks, Marcis Gasuns.

  90. I’m a little stunned that everybody’s griping about how this looks at 16 x 16. What is this, the mid 90s? That small most icons are fine if you can recognize them.

    This one is an improvement over the old, but has some optical problems for me at all sizes below 256. It appears to elongate vertically, and look less than round on top.

    I suppose it’s easy enough for me to build my own personal version from the 512 x 512 and throw it into Icon Composer.

  91. Your product has been, to me, mostly stable. I sure love Firefox over IE8. You guys and gals have done a remarkable job but could maybe try to combine some of the smaller updates before sending a package of updates.
    I have no idea why my firefox ikon disappeared other than windows 7 and I want my globe on fire (64×640)
    That will make me happy for a while. This process, with having to rekey the goofy print will only be tried by me once as my BS threshold is very low now.
    Mike H

  92. What happened to “gonna have the vector files released soon”? It’s been like two years, man. :I

    Also, lol at everyone who thought the drab pre-3.5 logo was better.

  93. powerful execution……i like it..

  94. That is to say some things that inspire us. Never knew it could be that opinions varied. Thanks for all the enthusiasm to provide useful information, like here.