Android app icons size

Android App Icon Size Guide (4.0)

This article has now been superseded by the latest Lollipop 6.0 Android Icon Size Guide. Please click on the image below to view the latest information.

Find the correct Android App Icon Sizes, fast

For the latest information see: Simple Android Icon Size Guide for Lollipop 5.1 (5.1)

An icon is a graphic that takes up a small portion of screen real estate and provides a quick, intuitive representation of an action, a status, or an app. So, Icons should get people’s attention and can be much more efficient than words.

Your icon design for Android 4.0 should follow the general specification and be focused around three overarching goals:

  • App Icons should combine beauty, simplicity and purpose;
  • Icons should make life easier and be easy to understand, and never overwhelm with too many details. When people use your app for the first time, they should intuitively grasp the most important functions;
  • Create and manage Icon sets for multiple densities to provide Icons in such a way that they will be displayed optimally on any device, regardless of the device’s screen size or resolution.

Size and Format

Android Icons should be 32-bit PNGs with an alpha channel for transparency. The finished Icons dimensions corresponding to a given generalized screen density, are shown in the table below.

Table 1. Summary of finished Icons dimensions for each generalized screen density.

ldpi (120 dpi)

Low density screen

mdpi (160 dpi)

Medium density screen

hdpi (240 dpi)

High density screen

xhdpi (320 dpi)

Extra-high density screen Launcher Icon Size 36 x 36 px 48 x 48 px 72 x 72 px 96 x 96 px Action Bar Icon Size 18 x 18 px 24 x 24 px 36 x 36 px 48 x 48 px Status Bar Icon Size
(Android 3.0 and Later) 18 x 18 px 24 x 24 px 36 x 36 px 48 x 48 px Dialog icon 24 x 24 px 32 x 32 px 48 x 48 px List View Icons 24 x 24 px 32 x 32 px 48 x 48 px

Let’s talk about detailed guidelines for the common types of icons used throughout Android applications. You can read where each types of icons are used in our previous post Android App Icon Sizes (3.0).

Table 2. Summary of Icons informations.

Sizes & scale

Proportions

Style

Colors

Launcher Icons Launcher icons on a mobile device must be 48×48 dp.Launcher icons for display on Google Play must be 512×512 pixels. Full asset, 48×48 dp Use a distinct silhouette. Three-dimensional, front view, with a slight perspective as if viewed from above, so that users perceive some depth. Action Bar Action bar icons for phones should be 32×32 dp. Full asset, 32×32 dpOptical square, 24×24 dp Pictographic, flat, not too detailed, with smooth curves or sharp shapes. If the graphic is thin, rotate it 45° left or right to fill the focal space. The thickness of the strokes and negative spaces should be a minimum of 2 dp. Colors: #333333Enabled: 60% opacityDisabled: 30% opacityColors: #FFFFFFEnabled: 80% opacityDisabled: 30% opacity Small / Contextual Icons Small icons should be 16×16 dp. Full asset, 16×16 dpOptical square, 12×12 dp Neutral, flat, and simple. Filled shapes are easier to see than thin strokes. Use a single visual metaphor so that a user can easily recognize and understand its purpose. Use non-neutral colors sparingly and with purpose. For example, Gmail uses yellow in the star icon to indicate a bookmarked message. If an icon is actionable, choose a color that contrasts well with the background. Notification Icons Notification icons must be 24×24 dp. Full asset, 24×24 dpOptical square, 22×22 dp Keep the style flat and simple, using the same single, visual metaphor as your launcher icon. Notification icons must be entirely white. Also, the system may scale down and/or darken the icons.
Читайте также:  Что такое синтетический анализ андроид

Need an Android icon?

Let’s improve your sales with an app icon that converts

Tips for Designers

  • Use vector shapes where possible. When possible, use vector shapes so that if the need arises, assets can be scaled up without loss of detail and edge crispness. Using vectors also makes it easy to align edges and corners to pixel boundaries at smaller resolutions.
  • Start with large artboards. Because you will need to create assets for different screen densities, it is best to start your icon designs on large artboards with dimensions that are multiples of the target icon sizes.
  • When scaling, redraw bitmap layers as needed. If you scaled an image up from a bitmap layer, rather than from a vector layer, those layers will need to be redrawn manually to appear crisp at higher densities.
  • When saving image assets, remove unnecessary metadata. Although the Android SDK tools will automatically compress PNGs when packaging application resources into the application binary, a good practice is to remove unnecessary headers and metadata from your PNG assets. Tools such as OptiPNG or Pngcrush can ensure that this metadata is removed and that your image asset file sizes are optimized.
  • Make sure that corresponding assets for different densities use the same file names. Corresponding icon asset files for each density must use the same file name, but be stored in density-specific resource directories. This allows the system to look up and load the proper resource according to the screen characteristics of the device. For this reason, make sure that the set of assets in each directory is consistent and that the files do not use density-specific suffixes.

Android Icon Downloads

You can download archives (that you might find useful as you develop icons) using the links below:

The Android Icon Templates Pack is a collection of template designs, textures, and layer styles that make it easier for you to create icons that conform to the guidelines. The icon templates are provided in the Adobe Photoshop filye format (.psd), which preserves the layers and design treatments that used when creating the standard icons for the Android platform.

Action bar icons are graphic buttons that represent the most important actions people can take within your app. The download package includes icons that are scaled for various screen densities and suitable for use with the Holo Light and Holo Dark themes. The package also includes unstyled icons that you can modify to match your theme, plus source files.

Use color primarily for emphasis. Choose colors that fit with your brand and provide good contrast between visual components. Blue is the standard accent color in Android’s color palette. Each color has a corresponding darker shade that can be used as a complement when needed.

Читайте также:  Android builder что это такое

In Android Icon Templates Pack, v4.0 you can find also example materials:

Need an expert to design your Android icons?

We will create a design you love, that also converts more customers.

Источник

Android Icon Sizes Made Simple (4.1)

This article has now been superseded by the latest Lollipop 6.0 Android Icon Size Guide. Please click on the image below for the latest information.

What are Android Icon Sizes?

It is a simple question but even Android, who provide better documentation than most, seems to make you want to work a little for the answer. Fear not, I have done the work for you!

Android Icon Sizes – App Launcher

What sizes do I need for Android App launcher icons? If you want to design your own or commission a professional to design your custom icons, you really need to know the right sizes.

Quick answer: 48 px, 72 px, 96 px, 144 px, 192 px & 512 px (for Google Play Store).

What about the Google Play Icon?

Google play requires a single additional version of the Icon in 512 x 512 pixels.

Understanding Android Icon Sizes

Android approach their Icon Size documentation slightly differently to other platforms, concentrating on different pixel densities rather than the simple facts we want. However, it is worth taking a moment to understand why they use this approach.

As technology has progressed, manufacturers have brought out hardware with ever increasing resolutions and pixel density. An increase in pixel density or dots per inch (dpi), basically means more image information can be displayed with.

  • MDPI – Medium Pixel Density – also known as the ‘Baseline’
  • HDPI – High Pixel Density
  • XHDPI – Extra High Pixel Density
  • XXHDPI – Extra Extra High Pixel Density

Note: Android also supports low-density (LDPI) screens, but you normally don’t need to create custom assets at this size because Android effectively down-scales your HDPI assets by 1/2 to match the expected size.

Need an expert to design your Android icons?

We will create a design you love, that also converts more customers.

Android Icon Sizes – User interface

All Android icons follow the same scaling rules, so when creating your icon files you must make 5 versions to cover all the platforms available. The table below shows the pixel densities and icon sizes for the different types of user interface icons used by Android:

640 dpi

MDPI (Baseline) HDPI XHDPI XXHDPI XXXHDPI
Scale 1 x 1.5 x 2 x 3 x 4 x
DPI
App Launcher Icons 48 px 72 px 96 px 144 px 192 px
Action bar Icons 32 px (24px inset) 48 px 64 px 96 px 128 px
Small / Contextual Icons 16 px (12px inset) 24 px 32 px 48 px 64 px
Notification Icons 24 px (22px inset) 36 px 48 px 72 px 96 px

Whilst the user interface icons follow the same scaling rules as the app launcher icon, they also have some additional display rules of their own:

Android Action bar Icon Sizes

Action Bar Icons require a file size of 32×32 pixels at the baseline size (MDPI). However, the image itself must be no more than 24×24 pixels centred within the Icon file.

The Icon Design must be single colour #666666 with a transparency set to 60%

Android Small / Contextual Icon Sizes

Action Bar Icons require a file size of 16×16 pixels at the baseline size (MDPI). However, the image itself must be no more than 12×12 pixels centred within the Icon file.

The Icon Design must be single colour #666666 with a transparency set to 60%

Android Notification Icon Sizes

Action Bar Icons require a file size of 24×24 pixels at the baseline size (MDPI). However, the image itself must be no more than 22×22 pixels centred within the Icon file.

The Icon Design must be single colour white, #ffffff.

Android’s own icon guide can be found here:

I hope this Android Icon size guide has been helpful. Please let me know if there is something else you would like me to add or elaborate on. Thanks!

Need Android icons?

Let’s improve your sales with app icons that convert

Owner and creative director at Creative Freedom Ltd. Unbelievably cool icon design expert, husband, and father of two awesome girls. A proper decent chappy and thoroughly fab to work with. Ok, so I wrote my own bio…

30 thoughts on “Android Icon Sizes Made Simple (4.1)”

Thanks for the reply.

“Note: Android also supports low-density (LDPI) screens, but you normally don’t need to create custom assets at this size because Android effectively down-scales your HDPI assets by 1/2 to match the expected size.”

I’ll add that to the Blog post.

I hope that helps.

Hi guys. Is it possible to set the height of the app icon to match the height of the action bar?

Thanks for posting. I don’t work on App development, just design to spec but I believe if you try and use larger icons sizes in the Action bar (or anywhere else) Android will just scale them to the standard size.

So I would say a tentative no but an App Developer may be able to help you more.

Sorry but I don’t get the density-resolution-dp-dpi thing. So if I want to support all densities, I should make 5 files – 48X48px/72X72px/96X96px/144X144px/192X192px.

That’s fine, but what resolution in pixels/inch should I input?
Is it 72 for all of them as per default? Or is it 160/240/320/480/640 pixels/inch?

I really don’t get what values for width, height and resolution to input for each file in Photoshop new file window!

Anyone willing to explain and help?

I’ll keep it simple, just use 72dpi in Photoshop, along with the file dimensions in pixels.

Clear and simple. Thank you!

Thanks for this! Would be nice if you could include the inset/un-padded dimensions in your table too, e.g. for notification icons.

Also, the ‘Iconography’ part of the Android design docs says that notification icons should be white, not #666666. I’m not sure about transparency, I’ve taken a gamble on all pixels being either white or transparent and it looks OK.

Thanks for the notification colour correction, post updated. 🙂
If I can fit the inset dimensions in the table I will.

Nice and simple and extremely useful.
Thank you very much!

I wrote a command line tool which can convert icons automatically to the right sizes for the different screen densities and which also saves everything in the right directories – it even supports the version structure of androids res/ folder.

The main idea is to have one SVG file for each icon. You do not have to have different SVG files for the states (e.g. enabled and disabled) but you can use icon-converter to change one or more colors in the icon.
Having all the SVG’s, you can simply write a .sh script to “compile” all the icons at once, meaning that icon-converter creates all PNG’s with the given settings (density, colors, scale, even versioning is supported, renaming files so that you can find them after compiling). The PNG’s are then stored directly in the right drawable-directories. E.g. when you change an icon which has different states, you only have to execute your script once and do not have to export PNG’s by yourself.

Please have a look at this tool, there are some examples online:
iconconverter.android-msapps.com

It runs on Linux and Windows.

Thanks for that, sounds useful. What kind of sampling algorithm does it use?

The conversion from .SVG to .PNG is done by the command line tool “convert” (ImageMagic).
On top of this I implemented the “android rules” and the recoloring.

Источник

Читайте также:  Six guns mod android
Оцените статью