The Big Sur-ification of macOS Icons

Here’s an example of some icons that transitioned well in the Big Sur-ification of macOS icons:

And just for good measure, here’s a few more — I love this stuff.

While some apps made this transition fun (and further infused their brand with character), others did not. They did the bare minimum and moved on.

A few years ago I tweeted about this “bare minimum” phenomenon where app makers updated their icon for macOS Big Sur by taking their previous icon/logo, putting it on a white squircle, and calling it a day.

That always felt like a bit of a shame when compared to the alternative: take an opportunity to imagine a new expression of your brand/logo/icon in the context and constraints of macOS Big Sur’s new icon template (i.e. the squircle).

For example, here’s a re-imagining of the Outlook icon (done by, as far as I can tell, agraaaaao).

It’s fun to see how folks take advantage of “the ever-so-subtle yet unique-to-macOS opportunity” to break outside of the outer edges of the squircle and provide some dimensionality to their icons.

As a self-professed icon-noisseur, I love browsing through app icons that people have re-imagined for their desktops — wresting control of the visual appearance of the app icon from its maker and appropriating it to themselves.

For example, as I browsed the wonderful macosicons.com gallery, I came across these alternatives for Chrome (the original from Google is on the far left, outlined in yellow):

Screenshot of three different Goolge Chrome icons for macOS Big Sur. The one outlined on the left is the original from Google, the others are more visually interesting alternatives from third parties.

I love seeing the character of Chrome bleed to the edges and fit the visual language of its environment (macOS). More visually interesting than merely dropping the Chrome circle on a white background.

In a similar vein, here’s Slack:

Screenshot of three different Slack icons for macOS Big Sur. The one outlined on the left is the original from Salesforce, the others are more visually interesting alternatives from third parties.

Again, more interesting to see some character infused into the icon (as opposed to just dropping it on a white background).

Where things get really interesting is when people explore breaking out of the squircle (which you can do on macOS) to provide some dimension to their icon. For example, here’s Firefox:

Screenshot of six different Firefox icons for macOS Big Sur. The one outlined on the upper left is the original from Mozilla, the others are more visually interesting alternatives from third parties that provide some dimensionality while breaking out of the squircle’s shape.

And there are some VSCode alternatives that explore both 1) going beyond a logo on a white background, and 2) providing dimension while borrowing from the visual language for Apple’s native development tool (Xcode).

Screenshot of five different VSCode icons for macOS Big Sur. The one outlined on the upper left is the original from Microsoft, the others are more visually interesting alternatives from third parties that provide some dimensionality while breaking out of the squircle’s shape.

Microsoft is perhaps the biggest culprit of “drop it on a white background” as their suite of office tools do precisely that — which makes it a fertile ground for folks re-imagining what the family of office icons could be.

For example here’s Outlook:

Screenshot of six different Outlook icons for macOS Big Sur. The one outlined on the upper left is the original from Microsoft, the others are more visually interesting alternatives from third parties that provide some dimensionality while breaking out of the squircle’s shape.

And here’s Excel:

Screenshot of nine different Excel icons for macOS Big Sur. The one outlined on the upper left is the original from Microsoft, the others are more visually interesting alternatives from third parties that provide some dimensionality while breaking out of the squircle’s shape.

Word:

Screenshot of nine different Word icons for macOS Big Sur. The one outlined on the upper left is the original from Microsoft, the others are more visually interesting alternatives from third parties that provide some dimensionality while breaking out of the squircle’s shape.

And Powerpoint:

Screenshot of nine different Powerpoint icons for macOS Big Sur. The one outlined on the upper left is the original from Microsoft, the others are more visually interesting alternatives from third parties that provide some dimensionality while breaking out of the squircle’s shape.

Just a little visual fun/exploration for your day. Adios!