The sizes of icons, avatars, and touch targets are important considerations for minimizing driver distraction.
Generously sized touch targets make it easier and quicker for drivers to interact with apps and return attention to driving.
Guidance at a glance (TL;DR):
- Use standard icon and avatar sizes for consistency
- Minimum touch-target size is 76 x 76dp
- Align and center icons and elements within touch targets
Icon sizes
Here are the standard icon sizes used by Android for Cars:
![Android for Cars icon sizes](https://developers.google.cn/cars/design/automotive-os/design-system/images/Size-1.png?authuser=8)
Primary icon | Secondary icon | Tertiary icon |
---|---|---|
44 x 44dp | 36 x 36dp | 24 x 24dp |
Avatar sizes
Here are the standard avatar sizes used by Android for Cars:
![Android for Cars avatar sizes](https://developers.google.cn/cars/design/automotive-os/design-system/images/Avatar_AR.png?authuser=8)
Small avatar | Medium avatar | Large avatar |
---|---|---|
56 x 56dp | 76 x 76dp | 96 x 96dp |
Aligning icons and touch targets
The minimum touch-target size in Android for Cars is 76 x 76dp. Touch targets must be large enough to be glanceable and easily selected by a driver while the car is in motion. Elements such as buttons should be centered within a touch target’s boundaries, and no part of an element should lie outside a touch target boundary.
![Keep touch-target sizes at or above 76 x 76dp](https://developers.google.cn/cars/design/automotive-os/design-system/images/Size-2.png?authuser=8)
Do
![Center elmements within the touch-target area](https://developers.google.cn/cars/design/automotive-os/design-system/images/Size-3.png?authuser=8)
Do
![Don't align element to one edge of a touch target](https://developers.google.cn/cars/design/automotive-os/design-system/images/Size-4.png?authuser=8)
Don’t
![Don't permit elements to fall outside of a touch target](https://developers.google.cn/cars/design/automotive-os/design-system/images/Size-5.png?authuser=8)
Don’t