OS X icons size
Solution 1
NSStatusBar icons (i.e. Menu bar icons) are different from regular app icons. I have not been able to find an NSStatusBar official icon guideline, but I have to believe that the Toolbar Icon guideline for buttons is pretty close. It suggests:
- Create icons that measure no more than 19x19 pixels.
- Make the outline sharp and clear.
- Use a straight-on perspective.
- Use black (add transparency only as necessary to suggest dimensionality).
- Use anti-aliasing.
- Use the PDF format.
- Make sure the image is visually centered in the control (note that visually centered might not be the same as mathematically centered).
In testing, I've found:
- NSStatusBar seems to look best with something 18 pixels high, or less. The systemStatusBar has a thickness of 22.
- While it lists PDF format, I've been using png without issue.
- If you want your icon to be white on blue when it's selected, you need to provide the alternateImage as a separate white version of your icon.
Code sample:
myStatusItem = [[NSStatusBar systemStatusBar]statusItemWithLength:NSSquareStatusItemLength];
NSImage *statusImage = [NSImage imageNamed:@"Status.png"];
[myStatusItem setImage:statusImage];
NSImage *altStatusImage = [NSImage imageNamed:@"StatusHighlighted"];
[myStatusItem setAlternateImage:altStatusImage];
[myStatusItem setHighlightMode:YES];
[myStatusItem setMenu:self.myStatusMenu];
Solution 2
To make your menu item support Retina displays, Dark Mode and different states (e.g. pressed)
- Create two PNG images sized 16x16 and 32x32 pixels
- Create a new image asset in Xcode with Render As set to Template Image and add your images for 1x and 2x
- Initialize your NSImage from the image asset without changing its size:
NSImage(named: "Example")
Solution 3
Solution 4
Follow these steps and you will get a perfectly sharp status bar Icon for retina
- Open a png file of your Icon in photoshop it should be larger than 88px x 88px
- go to menu, Image, Image size
- set resolution to 350
- set size to 88px x 88px (pixels)
- save image as png add it xcode
Comments
-
maseth almost 4 years
What size should an application icon and menu bar icon for OS X be?
I can deal with small resolution displays but what about Retina - does an icon displayed on the menu bar (e.g. 20 x 20 ) will be smaller or blurred on a new MacBook Pro with Retina display? I reckon that the Application icon will be scaled, so if I'll prepare twice larger than regular it should be OK on Retina.
I found an excellent guide for iOS development with sizes specification but I can't find similar size specifications for OS X.