Stay organized with collections
Save and categorize content based on your preferences.
Content designed for a car screen must be legible and glanceable, with a consistent UI and large touch targets that drivers can identify under all viewing conditions.
To make sure drivers can quickly scan and understand onscreen content, the content must be presented in a way that’s easy to read while driving:
Display legible fonts
Visually presented primary and secondary text should align with Android for Cars guidelines for font and size. Primary text is typically used for pieces of information required for decision making, such as song titles or contact names, and should be 32dp. Secondary text is typically used for supporting information, such as artist name or call type (such as “mobile”), and should be 24dp.
Limit text length
Text items using the Roman alphabet must not exceed 120 characters, including punctuation and spaces. (Note for reference: The preceding sentence is 101 characters.) Text items in Japanese must not exceed a total of 31 Roman characters, kana, or kanji combined.
Follow contrast ratios for text, icons & background
The contrast ratio for icons, text, and other images must be at least 4.5:1. This requirement applies to any displayed items that convey information, including selected items in rotary inputs and the like. However, if redundant information is provided (such as an icon and text that convey the same meaning), only one element needs to meet contrast guidelines. For rotary inputs, the contrast guideline must be met for the highlight against the background.
Provide glanceability at night
Polarity of content shown during the daytime can be positive (dark text on light background) or negative (light text on dark background), while content shown during nighttime must be negative polarity.
Make targets easy to touch
Drivers can easily get distracted or make mistakes when trying to touch onscreen targets that are too small or close together:
Display appropriately sized touch targets
Touch targets should adhere to the Android Automotive guidelines, for a minimum size of 76 x 76dp. For special cases, width can be slightly sacrificed in favor of height (while keeping overall area the same) to better accommodate up-and-down vehicle vibration.
Avoid touch target overlap
Touch targets must not overlap with one another. The option to zoom can help mitigate overlap issues by separating targets. If possible, allow at least 23dp between touch targets.
Keep UI elements consistent
To help drivers quickly understand their onscreen options, the user interface must be clear and consistent:
Use consistent map icons, terminology & interaction patterns
Icons and terminology should consistently map one-to-one to their functions. Likewise, interaction patterns should be consistent and predictable.
Clarify active & inactive features while in motion
The interface should clearly distinguish allowed from disallowed features – for example, by dimming distracting media content. The interface should also distinguish features that are intended for use only while driving versus those intended for use only while not driving. For example, the search box should be hidden while driving.
[[["Easy to understand","easyToUnderstand","thumb-up"],["Solved my problem","solvedMyProblem","thumb-up"],["Other","otherUp","thumb-up"]],[["Missing the information I need","missingTheInformationINeed","thumb-down"],["Too complicated / too many steps","tooComplicatedTooManySteps","thumb-down"],["Out of date","outOfDate","thumb-down"],["Samples / code issue","samplesCodeIssue","thumb-down"],["Other","otherDown","thumb-down"]],["Last updated 2024-07-23 UTC."],[[["\u003cp\u003eCar screen content must be legible and glanceable, with large touch targets for easy driver interaction.\u003c/p\u003e\n"],["\u003cp\u003eText should be limited in length, use appropriate font sizes, and maintain high contrast ratios for readability.\u003c/p\u003e\n"],["\u003cp\u003eTouch targets must be adequately sized and spaced to avoid accidental touches and driver distraction.\u003c/p\u003e\n"],["\u003cp\u003eThe user interface should be consistent, using familiar icons and terminology, with clear distinctions between active and inactive features.\u003c/p\u003e\n"],["\u003cp\u003eThe interface should prioritize safety by dimming distracting content and disabling non-essential features while driving.\u003c/p\u003e\n"]]],[],null,["# Visual principles\n\n\u003cbr /\u003e\n\nContent designed for a car screen must be legible and glanceable, with a consistent UI and large touch targets that drivers can identify under all viewing conditions.\n\nThis section describes how you can:\n\n- [Make content easy to read](#make_content_easy_to_read)\n- [Make targets easy to touch](#make_targets_easy_to_touch)\n- [Keep UI elements consistent](#keep_ui_elements_consistent)\n\n*** ** * ** ***\n\nMake content easy to read\n-------------------------\n\nTo make sure drivers can quickly scan and understand onscreen content, the content must be presented in a way that's easy to read while driving:\n\n### Display legible fonts\n\n\nVisually presented primary and secondary text should align with Android for Cars guidelines for font and size. Primary text is typically used for pieces of information required for decision making, such as song titles or contact names, and should be 32dp. Secondary text is typically used for supporting information, such as artist name or call type (such as \"mobile\"), and should be 24dp. \n| **Rationale:** Text legibility in the context of driving can be affected by many factors, such as lighting, time of day, font proportions (thin, medium, bold) and contrast. Highly legible text helps drivers shorten glance times as well as decision times, thus reducing cognitive and visual distraction.\n\n### Limit text length\n\n\nText items using the Roman alphabet must not exceed 120 characters, including punctuation and spaces. (Note for reference: The preceding sentence is 101 characters.) Text items in Japanese must not exceed a total of 31 Roman characters, kana, or kanji combined. \n| **Rationale:** Long strings of text encourage long glances to read the entire message, thus increasing visual distraction and the incidence of crashes and near-crashes.\n\n### Follow contrast ratios for text, icons \\& background\n\n\nThe contrast ratio for icons, text, and other images must be at least 4.5:1. This requirement applies to any displayed items that convey information, including selected items in rotary inputs and the like. However, if redundant information is provided (such as an icon and text that convey the same meaning), only one element needs to meet contrast guidelines. For rotary inputs, the contrast guideline must be met for the highlight against the background. \n| **Rationale:** Drivers must perceive content and selections accurately under various lighting conditions (bright sunlight, overcast, and so on).\n\n### Provide glanceability at night\n\n\nPolarity of content shown during the daytime can be positive (dark text on light background) or negative (light text on dark background), while content shown during nighttime must be negative polarity. \n| **Rationale:** Positive polarity during nighttime increases brightness sensitivity and after-images. The colors and luminosity of the display should not dazzle or impair visual clarity during day or night usage.\n\n*** ** * ** ***\n\nMake targets easy to touch\n--------------------------\n\nDrivers can easily get distracted or make mistakes when trying to touch onscreen targets that are too small or close together:\n\n### Display appropriately sized touch targets\n\n\nTouch targets should adhere to the Android Automotive guidelines, for a minimum size of 76 x 76dp. For special cases, width can be slightly sacrificed in favor of height (while keeping overall area the same) to better accommodate up-and-down vehicle vibration. \n| **Rationale:** Small touch targets increase the likelihood of missing the touch target. In addition, the driver may need to glance or search for the touch target for a longer period of time, increasing visual and cognitive distraction.\n\n### Avoid touch target overlap\n\n\nTouch targets must not overlap with one another. The option to zoom can help mitigate overlap issues by separating targets. If possible, allow at least 23dp between touch targets. \n| **Rationale:** Eliminate touch target overlap to prevent clutter confusion and users missing the correct touch target.\n\n*** ** * ** ***\n\nKeep UI elements consistent\n---------------------------\n\nTo help drivers quickly understand their onscreen options, the user interface must be clear and consistent:\n\n### Use consistent map icons, terminology \\& interaction patterns\n\n\nIcons and terminology should consistently map one-to-one to their functions. Likewise, interaction patterns should be consistent and predictable. \n| **Rationale:** A consistent familiar interface reduces the time and cognitive effort required by the driver and makes decision-making easier.\n\n### Clarify active \\& inactive features while in motion\n\n\nThe interface should clearly distinguish allowed from disallowed features -- for example, by dimming distracting media content. The interface should also distinguish features that are intended for use only while driving versus those intended for use only while not driving. For example, the search box should be hidden while driving. \n| **Rationale:** Clearly communicate to users when options are unavailable or currently inaccessible, to enhance general understanding of system state at a glance."]]