DesignRef Logo
DesignRef
Design SystemsCompareQuick Ref
SearchK
Google
Material Design 3

App Icon Specifications

Platform icon sizes, corner radius, grid specs, and usage guidelines.

2 platforms9 icon sizes1 with grid specs
Icon stats
2
Platforms
9
Icon sizes
1
Grid specs
13
Guidelines
Platforms
AndroidWeb (PWA)
All Design Systems

Material Design 3

OverviewColorsTypographySpacingShapeMotionStatesElevationBreakpointsTokensCustomizationContent DesignGlossaryComponentsSymbolsPatternsInputsApp IconsMaterialsSystemLocalizationAccessibilityPlatforms
OverviewColorsTypographySpacingShapeMotionStatesElevationBreakpointsTokensCustomizationContent DesignGlossaryComponentsSymbolsPatternsInputsApp IconsMaterialsSystemLocalizationAccessibilityPlatforms
All Platforms

Icon sizes, corner radius specifications, and design guidelines for each platform.

Icon Size Comparison

16pt
29pt
40pt
60pt
76pt
120pt

Android

Corner Radius: OEM-defined mask (circle, squircle, rounded square, etc.)

SizeScalePixelsUsage
108dpFullAdaptive icon total canvas (foreground + background layers)
72dpSafe zoneInner safe zone where key artwork must fit (66dp visible)
48dpLauncherStandard launcher icon display size
512px1xGoogle Play Store listing icon

Grid Specifications

108×108dp total canvas, 66dp centered safe zone, foreground + background layers composited by the system

Guidelines

  • •Use Adaptive Icons with separate foreground and background layers
  • •Keep all critical artwork within the 66dp inner safe zone
  • •Do not place text or fine detail outside the safe zone — OEM masks will crop it
  • •Test with multiple OEM masks: circle, squircle, rounded square, teardrop
  • •Support monochrome themed icons for Android 13+ Material You integration
  • •Background layer should be a simple color or subtle pattern
  • •Foreground layer should use the full 108dp canvas for parallax motion

Web (PWA)

Corner Radius: None (browser applies mask)

SizeScalePixelsUsage
512px1xSplash screen and install prompt
192px1xWeb app manifest icon
180px1xApple touch icon for iOS home screen
32px1xBrowser favicon (standard)
16px1xBrowser favicon (small)

Guidelines

  • •Provide both 192×192 and 512×512 icons in the web app manifest
  • •Include a maskable icon variant for Android Chrome home screen integration
  • •Use transparent PNG for standard icons to work on any background
  • •Provide an SVG favicon for scalable browser tab icons
  • •Include an Apple touch icon (180×180) for iOS Safari home screen
  • •Ensure icons are legible at 16×16 for favicon use