Keypad
Stay organized with collections
Save and categorize content based on your preferences.
Except as otherwise noted, the content of this page is licensed under the Creative Commons Attribution 4.0 License, and code samples are licensed under the Apache 2.0 License. For details, see the Google Developers Site Policies. Java is a registered trademark of Oracle and/or its affiliates.
Last updated 2024-07-23 UTC.
[[["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\u003eThe keypad enables users to input phone numbers within the Dialer application.\u003c/p\u003e\n"],["\u003cp\u003eIt features a consistent layout across various screen sizes (tall, standard, short) with clear margins, keylines, and padding.\u003c/p\u003e\n"],["\u003cp\u003eKeypad elements adhere to specific typography, color, and sizing guidelines for visual consistency.\u003c/p\u003e\n"],["\u003cp\u003eRoboto is the primary typeface, with color variations for day and night modes to ensure readability.\u003c/p\u003e\n"],["\u003cp\u003eThe keypad design incorporates motion, though specific details are not outlined in this document.\u003c/p\u003e\n"]]],[],null,["# Keypad\n\n\u003cbr /\u003e\n\nThe keypad allows users to enter phone numbers in Dialer.\n\n*** ** * ** ***\n\nAnatomy\n-------\n\n1.Digit key label \n2. Letter key label\n\n*** ** * ** ***\n\nSpecs - Keypad\n--------------\n\n[Layout\nMargins, keylines, and padding for various screen sizes](/cars/design/automotive-os/design-system/layout) \n[Layout labels\nDefinitions of E, M, KL, P, Flex](/cars/design/intro-terms#layout_labels)\n\n### Keypad in tall screen\n\n### Keypad in standard screen\n\n### Keypad in short screen\n\n### Keypad with divider\n\n*** ** * ** ***\n\nStyles\n------\n\n[Typography guidelines\nScale and grid references, typographic examples, and more](/cars/design/automotive-os/design-system/typography) \n[Color guidelines\nPalettes, elevation and opacity values, and more](/cars/design/automotive-os/design-system/color)\n\n### Typography\n\n| Type style | Typeface | Weight | Size (dp) |\n|------------|----------|---------|-----------|\n| Body 1 | Roboto | Regular | 32 |\n| Subtitle 3 | Roboto | Regular | 18 |\n\n### Color\n\n| Element | Color(day mode) | Color (night mode) |\n|----------------------|-----------------|--------------------|\n| Primary type / icons | White | White @ 88% |\n| Divider line | White @ 22% | White @ 12% |\n\n### Sizing\n\n| Element | Size (dp) |\n|------------------------|-----------|\n| Tertiary icon | 24 |\n| Touch target | 76 |\n| Divider line thickness | 1 |\n\n*** ** * ** ***\n\nMotion\n------"]]
