This lets you easily spot the difference if you have both installed (and next to each other) in your dock.
Visual studio code logo for mac#
Whilst keeping the shape of the background the same for our macOS icons, we were conscious on making sure that VS Code was easy to identify next to Visual Studio for Mac so we’ve adopted a darker look for the shape.
Using the same shape, as well as stencil look to the Insiders build, allowed us to do that easily.
Visual studio code logo windows#
What we also wanted to add to the macOS version was a stronger connection with the Windows icon which would strengthen the recognition between the two versions. We considered having the same icon across all three operating systems but decided to follow the native Mac style. We’ve kept a macOS style icon for Visual Studio Code on the Mac. VS Code's current macOS icon (above left) and the proposed icon (above right) ⚠️ NOTE: Please read our updated response, we will not have a custom icon for the Mac, we will use the same icon across all platforms. VS Code's current Insiders build icon (above left) and the proposed version (above right) Keeping a native macOS style icon To improve accessibility, we needed a something that is more than color, so taking inspiration from the other Visual Studio Preview builds, we have brought a “stencil” look to the Insiders version VS Code while keeping the familiar green. This allows us to using lighting and shadows to create an overlapped effect, but also has the added advantage of lifting the icon up and off many flat colors it might encounter.Īn example of the proposed icon on some of the blues and greens that you can choose in Windows10. To make the icon more legible on a variety of backgrounds (from the desktop to the file chooser), we have added depth to the icon. The proposed icons for the stable and Insiders builds of VS Code as well as Visual Studio 2019
This allows us to increase the size of the VS Code shape (the key identifier of difference) to a size where it’s now a lot simpler to glance across the taskbar and spot your favorite code editor. We are dropping the thick ribbon on the right side of the icon. VS Code's current Windows icon (above left) and the proposed icon (above right) Making it easier to find
Visual studio code logo driver#
While this was not our main driver of change, it made sense to learn from the other work and leverage a similar style to solve some of the issues we were seeing. You’ll have seen some of this in the latest product icons for Visual Studio (Windows) and Visual Studio for Mac as well as some of the recent Office icon updates. An opportunity to learnĪs well as your feedback, there was also efforts going on inside Visual Studio and Visual Studio for Mac on aligning with iconography across Microsoft, being led by Windows and Office. Finally, some commented that the macOS version of the product icon looks out of place amongst other apps in the dock.
The size of the VS Code shape itself, when wrapped within the Visual Studio Family ribbon (the “wall” on the right) makes the difference between Visual Studio and Visual Studio Code hard to spot, especially for some customers with color vision deficiency. The current icon is hard to see on some customers taskbars as well as in some parts of the Windows UI like the file chooser dialog. We wanted to share where we are and get your thoughts. There are still a few outstanding issues with current icon, and we’ve been spending time over the past few weeks looking at ways to resolve them. The 2017 icon change showed how much passion and interest there in the iconography for VS Code, and we thank you for that feedback. ⚠️ NOTE: Please read our updated response based on the feedback ⚠️
0 kommentar(er)
