Dialog Icons

Dialog icons are shown in pop-up dialog boxes that prompt the user for interaction. They use a light gradient and inner shadow in order to stand out against a dark background.

As described in Providing Density-Specific Icon Sets, you should create separate icon sets for low-, medium-, and high-density screens. This ensures that your icons will display properly across the range of devices on which your application can be installed. See Table 1 for a listing of the recommended finished icon sizes for each density. Also, see Tips for Designers for suggestions on how to work with multiple sets of icons.

Table 1. Summary of finished dialog icon dimensions for each of the three generalized screen densities.

Final art must be exported as a transparent PNG file. Do not include a background color.

Templates for creating icons in Adobe Photoshop are available in the Icon Templates Pack.

All Android Versions

The following guidelines describe how to design dialog icons for all versions of the Android platform.

Structure

• Dialog icons have a 1 pixel safeframe. The base shape must fit within the safeframe, but the anti-alias of a round shape can overlap the safeframe.
• All dimensions specified on this page are based on a 32x32 pixel artboard size in Adobe Photoshop. Keep 1 pixel of padding around the bounding box inside the Photoshop template.

Figure 1. Safeframe and fill gradient for dialog icons. Icon size is 32x32.

Light, effects, and shadows

Dialog icons are flat and pictured face-on. In order to stand out against a dark background, they are built up using a light gradient and inner shadow.

Figure 2. Light, effects, and shadows for dialog icons. 1. Front part: gradient overlay | angle 90° bottom: r 223 | g 223 | b 223 top: r 249 | g 249 | b 249 bottom color location: 0% top color location: 75% 2. Inner shadow: black | 25% opacity | angle -90° | distance 1px | size 0px