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](https://developer.android.com/guide/practices/ui_guidelines/icon_design#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](https://developer.android.com/guide/practices/ui_guidelines/icon_design#design-tips)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.

|                  | `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) |
| Dialog Icon Size |              24 x 24 px              |               32 x 32 px                |              48 x 48 px               |                  64 x 64 px                  |
|------------------|--------------------------------------|-----------------------------------------|---------------------------------------|----------------------------------------------|

**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](https://developer.android.com/guide/practices/ui_guidelines/icon_design#templatespack).

## 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.

|--------------------------------------------------------------------------------------------------------------|--------------------------------------------------------------------------------|
| ![A view of dialog icon structure.](https://developer.android.com/static/images/icon_design/dialog_icon.png) | **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.

|--------------------------------------------------------------------------------------------------------------------------------------|------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
| ![A view of light, effects, and shadows for dialog icons.](https://developer.android.com/static/images/icon_design/dialog_light.png) | **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                                                                               | |

|-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|
| #### Step by step 1. Create the basic shapes using a tool like Adobe Illustrator. 2. Import the shape into a tool like Adobe Photoshop and scale to fit an image of 32x32 px on a transparent background. 3. Add the effects seen in Figure 2 for the proper filter. 4. Export the icon at 32x32 as a PNG file with transparency enabled. |