New Firefox Icon: Iteration 14 in Context

Here is how iteration 14 of the new Firefox icon would appear in context on mozilla.com, XP, OS X and Vista. I’ll try to get some Linux images posted as soon as we have a patch ready.

The icon is being rendered by Anthony Piraino at the Iconfactory. The design has been influenced by a conceptual sketch by Jon Hicks, and a conceptual render by Stephen Horlander.

The reflection line featured in this iteration gives the globe a bit more gloss and dimensionality. It also helps to establish two contrasting textures in the icon, making the refresh really more about fidelity of detail as opposed to more significant structural or color palette changes. This type of reflection line is also consistent with common textures and lighting found in Vista and OS X, and blurs out at the smaller XP-sized resolutions.

Download

Download

XP

Desktopxp

OS X

Note: the shadow being clipped off at the top of the icon is actually being drawn by OS X, and isn’t really something we can directly control (aside from making the icon visually smaller).

Desktoposx

Vista

Desktopvista

About

73 comments

  1. In the quick launch area, next to the start menu, the tail is nearly touching the head. Shouldn’t it be shorter, like in the larger icon?

    On OS X, is the planned icon larger? I don’t notice the shadow being clipped at the top with the existing icon.

  2. Lovely screenshots. I don’t see any Linux ones. Is Mozilla ever going to learn? Don’t you remember the whole visual refresh issue that happened on this very blog?

  3. Very good. The small versions could still be improved, tho.
    It will also be interesting to see how it looks in a GNOME or KDE environment.

  4. Could we see a comparison shot between the current Fx 3.0 icon and the newest iteration of the refresh at these resolutions?

  5. The logo looks good, but these screenshots seem to be a bit oversaturated. It’s hard to give a proper opinion when the colors seem off.

    I still think it would be useful to put old and new side by side, if only to see exactly what has changed.

  6. I’m not sure I like the gloss on this one tbh, looks like it goes off to nowhere. Also, the tail in the quicklaunch toolbar looks like it curls up too far.

    Still, I really am just nitpicking, you’ve done an incredible job on this, and I would be tremendously happy if this was the final logo.

  7. I wasn’t sure about it before, but it looks great in context. The darker outline on the Vista quick start certainly makes it stand out more.

    I’m really loving the smoothness of it now too :D

  8. Great! it looks very nice, I wish i could have it in my 3.5pre :P
    It looks a bit different when its 32×32 on vista and XP..

  9. I like it. However, I still find the top of the globe too bright, especially on Windows XP and the 16×16 icon in the Quick Launch.

  10. Very cool, adds more accent to the fire tail.

  11. The icon looks great on the website and Mac OS, though not as good in XP and Vista. The top still looks too shiny, especially on XP and for smaller sizes on Vista.

  12. You nailed it. Honestly can’t think of any more improvements. Great job!

  13. Very nice! The extra shine on the globe makes a bigger difference from the current Firefox icon than I would have expected.

  14. I like it. I really like it. But the tail, I think it goes out just a bit too far. It takes away from the head to have such a huge tail. Also, I think maybe the bit where the head turns into the tail, it begins to get a bit too pointy is a bit too soon.

  15. Miroslav Mazel

    I really like this. I think it’s done (but I still prefer the smoother lighting from iterations 11 and 12-1). Wow, this process was fun — I’m looking forward to the 3.5 release!

  16. It looks just gorgeous
    i hope the oficial release to come soon

  17. I really like the icon. It has a professional look and is both distinct from as well as in line with the current version of the Firefox icon.

    The fact that the icon shadow gets cut off at the top is a shame. Personally I’d prefer to make the icon just a tad smaller to avoid that.

    My compliments for both the process and the achievement so far!

  18. You’re good at ignoring criticisms…

  19. Looks better than the previous one :)

  20. Miroslav Mazel

    Nevermind, I’m starting to really like the asymetrical highlight…

  21. Could you also include a screenshot of the Windows XP installer. It has very large close up of the icon on the first page.

  22. Ok… lets say that program icon looks good. How about mime types? I hate XP-style icons in Vista.

  23. Looking good… Much better than the current icon. Maybe a screenshot on Windows 7, as the taskbar is quite different there?

  24. I really dislike the brightness of the globe. I think it’s a bit too distracting, and should be toned down.

  25. Compared to the current Firefox icon, it seems to me like the top of the icon blends into a white background. The top of the globe (and how white it is) makes it difficult to see where the icon ends.

  26. In line with my previous comment: This iteration looks like it has, at gnome-panel size, too much fox and not enough globe.

  27. Skylar L. Primm

    Lovely! I can’t wait to see it in my own dock.

  28. It looks good, but I still don’t get the highlight “teardrop” shape. What kind of light source creates a reflection like that?

    The cut-off shadow is a bit odd, hopefully that can be fixed.

    A few more shots from other places, like for .html files in Windows Explorer etc would be good, and Linux icons too.

    Good work though, keep it up.

  29. To be honest, I’m not really all that enthusiastic about this new icon. I think the ideas have gradually been getting better through the various iterations, but I’m still not liking how this looks at low resolutions. The XP-sized icons just look blurry and unattractive to me, and the system tray icon seems oversaturated next to the IE icon.

    I think the problem with the XP-sized icon is simply that the icon contains too much detail for an icon that size. The individual parts of the tail are so small that it’s impossible to distinguish them, and the result is this blurry mess I’m seeing. While that may be unsolvable, something has to be done about the system tray icon looking oversaturated though, that must be solvable.

    The other sizes seems to look OK to me, though not much better than the current icon on the whole. Comparing the two though, I must admit that I miss the tuft of hair on top of the fox’s head that’s on the current icon. That was a bit of detailing added when the current icon was revised to give extra detail to the face and make the globe glossier, and I think it’d be a shame to lose it now.

  30. I don’t like the asymmetrical look one bit. The icon has lost its balance. With so many details there needs to be something that pulls it all together. The main and first draw is still on the gloss when first viewing the icon. It’s light, it should just be there, it should not be a prominent feature or element of the icon. At the very least, have the gloss fade out at the bottom of it instead of sharply defining it. The fox and tail are supposed to be the main features. It’s Firefox not Shiny Globe Fox. If the globe had some great significance like it represented the world of Mozilla and its communities, and the light represented the eternal light of Mozilla’s mission then ok, but that’s not the case. They are background objects yet they demand your attention. It just shouldn’t be.

    Sure the smaller the icon the better it looks (except for the appearance of the apparent piece missing from the top of the globe) but what about at larger sizes such as on t-shirts, posters, and wallpapers?

    I’m assuming that i14 is the final candidate considering that it is the only one of the last 6 to be displayed here and that’s too bad. I can’t say that it was an overwhelming consensus, but it appears to me that the greater majority of people who took the time to comment on the previous post expressed that they liked i11 or i12-1 more than any other (I counted about 12 votes for 11 or 12 out of 28 comments), and 14 probably got the fewest positive comments or was commented on at all.
    No matter how small, if you have a group of people representing those out in the trenches providing feedback, why not go with what they are saying?

    Look, Firefox could have a smashed bug for a logo and I’d still be promoting Firefox. However I probably wouldn’t use the smashed bug to promote it. I’m certainly not trying to equate i14 with a smashed bug. I’m sure that you got my point. The icon is so very close to perfection and I want to be one of the first standing on the mountain shouting about the final one, but I just don’t think that this is it.

  31. Again, the tail looks excactly like a feather on small sizes.

  32. Corey Burger, please read the post:

    “I’ll try to get some Linux images posted as soon as we have a patch ready.”

  33. Nice icon.

    Could you now address the 5-year-old printing bugs in firefox?

    Another idea: implement one-process-per-tab functionality ( do you know Google Chrome? )

    I’m a Firefox fan, but i’m worried about firefox guys talking about the look of an icon, when there are so important things to improve in Firefox.

    Now i’m typing this in Google Chrome ( in an Ubuntu 9.04 box ), and i’m afraid to say that it looks very promising.

    Come on Firefox! don’t sleep in your success. Wake up!

  34. The horrid gloss on the globe is pretty distracting. It looks more like some kind of plastic wrap over the planet than the planet itself.

    It kind of reminds me of 256 color resolutions, when a true color icon has all its colors rounded to the closest available color; the intended gradients vanish and the result is jagged.

    The gloss makes the icon look like the resolution is wrong.

  35. I really like the asymmetrical gloss but adding a subtle gradient to the gloss would soften it and perhaps would not take away from the fox so much.

    With the globe looking brilliantly three-dimensional, it’s making the fox look a little flat and the tail a little unconvincing.

    Being so distracted by the globe, many us have stopped commenting on the fox and tail. Does that mean that the fox and tail are a done deal?

  36. To all the laypeople I’ve shown, and even to my own trained eyes, without side-by-side comparison, this iterated logo revision looks no different from the original. I hope that’s the intent.

  37. I agree with others, please get rid of the strange gloss and use the one from iterations 11 or 12-1, thanks. Otherwise it’s perfect.

  38. Nice screenshots! :-) But the top is too bright and makes it look awkward.

  39. In Mac is great. In Windows Vista has improved respect the last iteration. In Windows XP, in the smaller version (favicon) the red shade at the right in the tail not convinced me but without it, the icon would be like today. Its a problem. And… more dark as the version of Vista?

  40. ______Linux_______

    What about some Linux previews?!

  41. Looks great! Though, I think the colors of the fox are a bit dull and could use some more brightness and contrast.

    Great work, guys!

  42. @Ubuntu:

    With all due respect, read the post again please.

  43. Dominic Spitaler

    When I first looked at the 16×16 icon I saw the firefox tailing around the Internet Explorer icon. The shine and the black outline of the fox’s head lets the globe look like an e.

    I like the assymetric reflection but in my opinion its too bright in smaller sizes.

    And the little piece of water on top of the planet looks really distracting to me, i think it should be a continous dark outline.

  44. Kurt (supernova_00)

    In your last post, pretty much everyone said they liked 11 or 12-1 and due to too much gloss and the weird line that extends past the right side of the nose…yet you pick the glossiest icon with the weird ass line. The head also looks very, very fuzzy on the 16px icons.

    Alex, maybe your only reading the first dozen comments on your blog each time and not checking back the next day to see what all was posted overnight.

  45. The logo itself is just about perfect now, but I have to say the shadow is extremely dark, especially on the Dock. I’m sure it’s partly because of my uncalibrated laptop screen, but still.

    Also, Corey raises a valid point about Linux screenshots/mockups. At the very least, please photoshop it into a default Ubuntu desktop or something.

    Keep up the good work!

  46. At first I didn’t like the shape of the reflection, but now that I’ve seen it in context I think it looks great. Can’t wait till release!

  47. I still think the shinyness is too shiny. The problem is that we have a fairly flat (vertical) fox wrapped “round” a 3D-look spherical globe. Which looks odd. I would suggest toning down the specular reflection/lightening on the top of the globe to make it look less like a polished marble.

  48. (“One of these things is not like the others… One of these things just doesn’t belong…” — Sesame Street)

    Aha! Shadow looks out of place on windows — it has light coming from 12o’clock (straight above), all the other windows icons have light coming from 10.30 or 11 or so (upper left, so shadow is below and to right).

    Yep, icon lighting is in the Vista User Experience Guidelines:

    Icons (example circled globe icon)
    http://msdn.microsoft.com/en-us/library/aa511280.aspx

    Icons: Lighting
    http://msdn.microsoft.com/en-us/library/aa511280.aspx#light

  49. Looks pretty darn good to me.

    Globe is now nicely subtle.

    Congrats

  50. I really like the logo the large size, but when it’s smaller (32×32 or 16×16) I think the shine on the globe is excessive, and it makes it look strange and too 3D. A bit cartoony.

  51. orlando, you’re posting on the blog of the user experience guy. Surprisingly enough, he works on user experience. Not “printing bugs”, not “one-process-per-tab functionality”.

    And to others, this blog is not the sole method by which the icon is developed, far from it. While your feedback is, I’m sure, valuable … don’t expect decisions made solely on the basis of what option got more votes or comments.

  52. I’m looking forward to some shots of how it looks on KDE 4.x :)

  53. @Kirkburn I don’t believe that anyone who has commented here or on other posts by Alex pertaining to this topic thinks that this is the one and only place that this is being discussed and that the feedback here is what will have the greatest influence on determining what will be the final version of the icon. To assume that everyone here thinks that is insulting to their (and my) intelligence.

    We know how Mozilla works and operates and while opening up discussions and allowing feedback on this topic in particular, a Mozilla trademark that doesn’t fit in the same operate with tranceparency category as other Mozilla open projects does, Mozilla has decided to do it and I’d hate to think that they did this to just appease people and say later on that we did open up the redesign issue to the public just to cover themselves.

    Mozilla is different than any other because they do not solely rely and act upon what is decided by a handful of people sitting around a table in a boardroom and that is why it is so enormously successful.

    My point when referring to votes is that the feedback here is comprised by a varying group of people who have the advantage of a different perspective than of those from directly within Mozilla. Mozilla develops and packages Firefox and we the average Joes and Janes are the ones on the ground getting it out there through our humble yet effective means.

    I’m far less concerned with what the icon of a product looks like once the sale has been made than I am of making that sale in the first place. The icon represents Firefox as a product, it represents Mozilla overall, it is badge of honor for its users, and it is and has always been a key marketing tool.
    The fact of the matter is that if people don’t like the final version, they’re not going to use it to promote Firefox on their site’s, t-shirts, walls etc. They’ll still promote it, but it won’t be as effective or visible.

    If I were seeing i14 for the very first time as the icon/logo of Mozilla Firefox, I probably wouldn’t give it too much more thought than thinking that it was cool (yet lopsided), but that’s not the case. Mozilla has offered each and every person that uses Firefox a piece of ownership of it and I can’t just except a definitive line drawn between the browser, its communities, and its contributors and an icon.
    When it comes down to it, of course there is a legal line but there is also the fact that Mozilla wouldn’t receive welcomed feedback at all if the icon was just changed and finalized behind closed doors.
    So the votes here matter or at least certainly should.

  54. Looks nice, but does it look good on Windows 2000? I believe, Windows 2000 is now the only supported OS, that doesn’t support the alpha blended icons.

  55. I love this icon in all variations except the 16×16 quicklaunch version for Windows. There is a very sharp, white spot between the head and the tail that looks like a glitch. Can it be toned down slightly to put more emphasis on the fox? Just make the brightest pixels a little less bright in the 16×16 version.

    I’d also love to see some Linux icons. We all love Linux, Mozilla included.

  56. I think that the icon looks great! The only criticism I can agree with would be in the 16×16 version’s 2×2 bright pixels.

    Is there anyplace we can get the ico files, and try them out ourselves?

  57. I’ve got a Release Candidate ‘candidate build’ and it has got the new icon and logo on the title bar and on the ‘About Mozilla Firefox’ window.

  58. If anyone wants it, it’s here: http://ftp.mozilla.org/pub/mozilla.org/firefox/nightly/
    Then it’s under ‘3.5rc1-candidates’.

  59. I focus on the “dark mark” at the bottom of the globe, it seems to be darker than the rest of the land

  60. The color of the fox’s fur is a little dark.

  61. You can get the new icon file from here too: https://bugzilla.mozilla.org/show_bug.cgi?id=497333

    The icon looks good on Windows 2000 too, but I do agree with candy. Especially the smaller sizes 16×16 and 32×32 looks too dark.

    Actually I think the icon has been brighten before because it was too dark.

    Here’s a comparison between the new and old icon: http://i40.tinypic.com/w86tdf.png

  62. This is how the title bar icon looks like in Firefox 3.5rc1 on Ubuntu (with the sand dust theme, which isn’t default, but whatever): http://i43.tinypic.com/2aj9lp0.jpg

    It’s obvious that the 16×16 icon needs some work, especially since it’s used in both the title bar, the application menu and on the panels in most setups. The light source should be less bright and you need to cut down on the amount of detail.
    The new icon looks great when it’s big (in docks and such, I guess then icon was designed for OS X), but you really still need to work on 16×16 and 32×32, which is still very common on Windows and Linux.

  63. After using the Firefox 3.5 RC 1 candidate for a couple of days, the new logo still looks almost perfect, IMHO. There are two things I suggest changing:

    1. The light source on the top of the globe shines too bright, in my opinion. This makes the top of the globe look very light blue, towards white; I propose toning the color down towards a more regular shade of blue.

    2. In Mac OS X, the Dock icon drop shadow is cut off at the top. I’ve compared the icon to other Dock icons (e.g. Safari) and the problem does not show there, because they made the icon a little bit smaller. I propose doing the same for the Firefox icon. Then the top of the Firefox icon will also nicely align with most of the other regular Dock icons (like Safari, Mail, Finder and Time Machine).

    The 16×16 icon looks very nice, IMO, on Mac OS X.

  64. It’s been some while since this iteration. So is this the final draft or are more coming??

  65. I liked the way the fur “beveled” in the old one better, looked more real. This one looks like a triangular orange slug with the harsh line in the fox’s back.

  66. Where i can download this icon? I use Linux tar.gz version of Firefox 3.5 and these files no have logo. PS Sorry for my english

  67. @adam664: the new RC has the new icon.

  68. But the Linux version uses icon from GNOME icon theme :(

  69. Firefox window uses new icon, but I need new icon for desktop and menu shortcuts.

  70. @Kirkburn

    If you think that printing bugs and whole-browser-crashes-because-one-tab-bad-behaviour don’t belong to “user experience” field, then we have a fundamental disagree here.

  71. This is what i don’t want. To have a new Firefox icon but a bug that affects millions of users , because some guy thought that using the internet explorer temporary files is a wise decision:

    https://support.mozilla.com/tiki-view_forum_thread.php?comments_parentId=381674&forumId=1

    Wake up Mozilla !!!!

  72. Forget the very minor details to a stupid icon, and focus on what people really care about: a web browser that is functional and fast. I’ve seen Firefox 3.5 consistently crash on certain websites on one PC, and have seen extremely slow startup/launch times on a number of PCs now.

  73. Where is the fox’s front paw coming from? The centre of its body? Also why is a fox humping the globe? Is this normal for foxes?