टाइपोग्राफ़ी लागू करना

डिस्प्ले का इस्तेमाल, टेक्स्ट की बड़ी और छोटी स्ट्रिंग के लिए किया जाता है. इसका इस्तेमाल, एक नज़र में दिखने वाली हीरो जानकारी, अहम मेट्रिक, भरोसेमंद या एक्सप्रेसिव ब्रैंड मोमेंट दिखाने के लिए किया जाता है.

• DisplayLarge सबसे बड़ी हेडलाइन होती है. डिस्प्ले, स्क्रीन पर सबसे बड़ा टेक्स्ट होता है. यह टेक्स्ट, हीरो इन्फ़ॉर्मेशन के लिए रिज़र्व होता है. यह ऐसी जानकारी होती है जिसे कम समय में देखा जा सकता है. इसमें अहम मेट्रिक, कॉन्फ़िडेंस या ब्रैंड के ऐसे पल शामिल होते हैं जिन्हें बड़े पैमाने पर और खास स्टाइल में दिखाया जाता है.
• DisplayMedium दूसरी सबसे बड़ी हेडलाइन होती है. डिस्प्ले, स्क्रीन पर मौजूद सबसे बड़ा टेक्स्ट होता है. यह टेक्स्ट, हीरो इन्फ़ॉर्मेशन के लिए रिज़र्व होता है. यह ऐसी जानकारी होती है जिसे कम समय में देखा जा सकता है. इसके अलावा, यह टेक्स्ट अहम मेट्रिक, कॉन्फ़िडेंस या ब्रैंड के ऐसे खास पलों के लिए भी रिज़र्व होता है जिन्हें बड़े पैमाने पर और खास स्टाइल में दिखाया जाता है.
• DisplaySmall सबसे छोटी हेडलाइन होती है. डिस्प्ले, स्क्रीन पर सबसे बड़ा टेक्स्ट होता है. यह टेक्स्ट, हीरो इन्फ़ॉर्मेशन के लिए रिज़र्व होता है. यह ऐसी जानकारी होती है जिसे कम समय में देखा जा सकता है. इसमें अहम मेट्रिक, कॉन्फ़िडेंस या ब्रैंड के ऐसे पल शामिल होते हैं जिन्हें बड़े पैमाने पर और खास स्टाइल में दिखाया जाता है.

टाइटल, क्रम के हिसाब से व्यवस्थित किया गया टेक्स्ट होता है. इसका इस्तेमाल, रास्ता ढूंढने के तरीके के तौर पर किया जाता है. जैसे, पेज, सेक्शन का टाइटल या सब-सेक्शन का टाइटल (TitleSmall के मामले में).

• TitleLarge सबसे बड़ा टाइटल होता है. टाइटल, डिसप्ले से छोटे होते हैं. इनका इस्तेमाल आम तौर पर, ऐसे टेक्स्ट के लिए किया जाता है जिस पर कम ज़ोर देना हो. यह टेक्स्ट छोटा होता है. इनका इस्तेमाल इंटरैक्टिव कॉम्पोनेंट के लिए नहीं किया जाता. इसके बजाय, इनका इस्तेमाल पेज के हेडिंग या सब-हेडिंग के लिए किया जाता है.
• TitleMedium, मीडियम टाइटल होता है. टाइटल, डिसप्ले से छोटे होते हैं. इनका इस्तेमाल आम तौर पर, ऐसे टेक्स्ट के लिए किया जाता है जिस पर कम ज़ोर देना हो. यह टेक्स्ट छोटा होता है. इनका इस्तेमाल इंटरैक्टिव कॉम्पोनेंट के लिए नहीं किया जाता. इसके बजाय, इनका इस्तेमाल पेज के हेडिंग या सब-हेडिंग के लिए किया जाता है.
• TitleSmall सबसे छोटा टाइटल होता है. टाइटल, डिसप्ले से छोटे होते हैं. इनका इस्तेमाल आम तौर पर, ऐसे टेक्स्ट के लिए किया जाता है जिस पर कम ज़ोर देना हो. यह टेक्स्ट छोटा होता है. इनका इस्तेमाल इंटरैक्टिव कॉम्पोनेंट के लिए नहीं किया जाता. इसके बजाय, इनका इस्तेमाल पेज के हेडिंग या सब-हेडिंग के लिए किया जाता है.

लेबल का इस्तेमाल, कॉम्पोनेंट लेवल के टेक्स्ट के लिए किया जाता है. इससे उस कार्रवाई के बारे में पता चलता है जो इंटरैक्ट करने पर होगी. लेबल का सबसे सामान्य और ज़्यादा इस्तेमाल किया जाने वाला ऐप्लिकेशन, बटन में नेस्ट किए गए टेक्स्ट के लिए होता है.

• LabelLarge सबसे बड़ा लेबल होता है. लेबल का इस्तेमाल, मुख्य टेक्स्ट दिखाने के लिए किया जाता है. जैसे, टाइटल बटन पर लेबल. इन्हें इंटरैक्टिव कॉम्पोनेंट पर लागू किया जाता है.
• LabelMedium, मीडियम लेबल है. इसका इस्तेमाल सबसे ज़्यादा किया जाता है. लेबल का इस्तेमाल, बटन पर प्राइमरी लेबल जैसे टेक्स्ट दिखाने के लिए किया जाता है. इन्हें इंटरैक्टिव कॉम्पोनेंट पर लागू किया जाता है.
• LabelSmall छोटा लेबल है. लेबल का इस्तेमाल, टेक्स्ट दिखाने के लिए किया जाता है. जैसे, बटन पर मौजूद सेकंडरी लेबल, कॉम्पैक्ट बटन पर मौजूद लेबल, और इंटरैक्टिव कॉम्पोनेंट पर लागू लेबल.

बॉडी को कॉन्टेंट टेक्स्ट के लिए रिज़र्व किया जाता है. जैसे, बॉडी कॉपी के पैराग्राफ़, जटिल डेटा विज़ुअलाइज़ेशन में इस्तेमाल किया गया टेक्स्ट, टाइम स्टैंप, और मेटाडेटा.

• BodyLarge सबसे बड़ा बॉडी टेक्स्ट होता है. बॉडी टेक्स्ट का इस्तेमाल आम तौर पर, लंबे टेक्स्ट के लिए किया जाता है. ऐसा इसलिए, क्योंकि यह छोटे टेक्स्ट साइज़ के लिए अच्छी तरह से काम करता है. टेक्स्ट के लंबे सेक्शन के लिए, सेरिफ़ या सैंस सेरिफ़ टाइपफ़ेस का इस्तेमाल करने का सुझाव दिया जाता है.
• BodyMedium दूसरा सबसे बड़ा साइज़ है. बॉडी टेक्स्ट का इस्तेमाल आम तौर पर, लंबे टेक्स्ट के लिए किया जाता है. ऐसा इसलिए, क्योंकि यह छोटे टेक्स्ट साइज़ के लिए अच्छी तरह से काम करता है. टेक्स्ट के लंबे सेक्शन के लिए, सेरिफ़ या सैंस सेरिफ़ टाइपफ़ेस का इस्तेमाल करने का सुझाव दिया जाता है.
• BodySmall तीसरा सबसे बड़ा एलिमेंट है. बॉडी टेक्स्ट का इस्तेमाल आम तौर पर, लंबे टेक्स्ट के लिए किया जाता है. ऐसा इसलिए, क्योंकि यह छोटे टेक्स्ट साइज़ के लिए अच्छी तरह से काम करता है. टेक्स्ट के लंबे सेक्शन के लिए, सेरिफ़ या सैंस सेरिफ़ टाइपफ़ेस का इस्तेमाल करने का सुझाव दिया जाता है.
• BodyExtraSmall सबसे छोटा बॉडी टेक्स्ट होता है. बॉडी टेक्स्ट का इस्तेमाल आम तौर पर, लंबे टेक्स्ट के लिए किया जाता है. ऐसा इसलिए, क्योंकि यह छोटे टेक्स्ट साइज़ के लिए अच्छी तरह से काम करता है. टेक्स्ट के लंबे सेक्शन के लिए, सेरिफ़ या सैंस सेरिफ़ टाइपफ़ेस का इस्तेमाल करने का सुझाव दिया जाता है.

नंबर वाली टेक्स्ट स्टाइल का इस्तेमाल, नंबर वाले अंकों के लिए किया जाता है. आम तौर पर, यह कुछ वर्णों तक ही सीमित होती है. बड़े डिसप्ले साइज़ पर, ज़्यादा जानकारी देने वाली प्रॉपर्टी का इस्तेमाल किया जा सकता है. इससे चौड़ाई वाले ऐक्सिस को कम से कम स्थानीयकरण और फ़ॉन्ट स्केलिंग की समस्याओं के साथ बड़ा किया जा सकता है.

• NumeralsExtraLarge, अंकों के लिए सबसे बड़ी भूमिका है. अंकों के बीच डिफ़ॉल्ट रूप से, टेबल के हिसाब से स्पेसिंग का इस्तेमाल किया जाता है. ये ऐसे नंबरों को हाइलाइट करते हैं जिन्हें एक नज़र में देखा जा सकता है. इनमें सिर्फ़ दो या तीन वर्ण होते हैं. इनमें स्थानीय भाषा का इस्तेमाल करने की ज़रूरत नहीं होती. जैसे, चार्जिंग स्क्रीन या टाइम पिकर.
• NumeralsLarge, अंकों के लिए दूसरी सबसे बड़ी भूमिका है. संख्याओं में डिफ़ॉल्ट रूप से, टेबल वाली स्पेसिंग का इस्तेमाल किया जाता है. ये बड़े साइज़ की संख्या वाली स्ट्रिंग होती हैं. इनका इस्तेमाल सिर्फ़ समय दिखाने के लिए किया जाता है. इनमें स्थानीय भाषा का इस्तेमाल करने की ज़रूरत नहीं होती. जैसे, टाइमर का काउंटडाउन या टाइम पिकर.
• NumeralsMedium, अंकों के लिए तीसरी सबसे बड़ी भूमिका है. संख्याओं में डिफ़ॉल्ट रूप से, टेबल वाली स्पेसिंग का इस्तेमाल किया जाता है. ये मीडियम साइज़ के नंबर होते हैं, जो अंकों की छोटी स्ट्रिंग तक सीमित होते हैं. इनमें स्थानीय भाषा का इस्तेमाल करने की ज़रूरत नहीं होती. जैसे, कदमों की गिनती या टाइम पिकर.
• NumeralsSmall, अंकों के लिए चौथी सबसे बड़ी भूमिका है. संख्याओं में डिफ़ॉल्ट रूप से, टेबल वाली स्पेसिंग का इस्तेमाल किया जाता है. इनका इस्तेमाल उन नंबर के लिए किया जाता है जिन पर कम ध्यान देने की ज़रूरत होती है. जैसे, तारीख और समय चुनने वाले टूल. इनमें स्थानीय भाषा का इस्तेमाल करने की ज़रूरत नहीं होती.
• NumeralsExtraSmall, अंकों के लिए सबसे छोटी भूमिका है. अंकों के बीच डिफ़ॉल्ट रूप से, टेबल के हिसाब से स्पेसिंग का इस्तेमाल किया जाता है. इनका इस्तेमाल उन नंबरों के लिए किया जाता है जिनमें अंकों की लंबी स्ट्रिंग की ज़रूरत होती है. साथ ही, इनमें स्थानीय भाषा का इस्तेमाल करने की ज़रूरत नहीं होती. जैसे, कसरत के दौरान की मेट्रिक.

आर्क हेडर टेक्स्ट का इस्तेमाल, यूज़र इंटरफ़ेस (यूआई) पर घुमावदार टेक्स्ट के लिए किया जाता है. जैसे, समय का टेक्स्ट और घुमावदार लेबल. कर्व के साथ-साथ टाइप को खास तौर पर ऑप्टिमाइज़ करने के लिए, फ़ॉन्ट ऐक्सिस को ज़रूरत के हिसाब से बनाया गया है. साथ ही, घुमावदार स्क्रीन के ऊपर और नीचे मौजूद वर्णों के बीच अलग-अलग स्पेस को अडजस्ट करने के लिए भी इसे बनाया गया है.

सबसे ऊपर

• ArcLarge का इस्तेमाल, आर्क हेडर और टाइटल के लिए किया जाता है. आर्क का इस्तेमाल, स्क्रीन पर घुमावदार पाथ के साथ टेक्स्ट दिखाने के लिए किया जाता है. इसका इस्तेमाल, स्क्रीन के सबसे ऊपर या सबसे नीचे मौजूद छोटे हेडर टेक्स्ट स्ट्रिंग के लिए किया जाता है. जैसे, पुष्टि करने वाले ओवरले.
• ArcMedium का इस्तेमाल, आर्क हेडर और टाइटल के लिए किया जाता है. आर्क का इस्तेमाल, स्क्रीन पर घुमावदार पाथ के साथ टेक्स्ट के लिए किया जाता है. यह स्क्रीन के सबसे ऊपर या सबसे नीचे मौजूद छोटे हेडर टेक्स्ट स्ट्रिंग के लिए रिज़र्व होता है. जैसे, पेज के टाइटल.
• ArcSmall का इस्तेमाल, टेक्स्ट की छोटी आर्क स्ट्रिंग के लिए किया जाता है. आर्क का इस्तेमाल, स्क्रीन पर घुमावदार पाथ के साथ टेक्स्ट के लिए किया जाता है. यह स्क्रीन के सबसे ऊपर मौजूद घुमावदार टेक्स्ट स्ट्रिंग के लिए रिज़र्व होता है. जैसे, समय का टेक्स्ट.

सबसे नीचे

• ArcLarge का इस्तेमाल, आर्क हेडर और टाइटल के लिए किया जाता है. आर्क का इस्तेमाल, स्क्रीन पर घुमावदार पाथ के साथ टेक्स्ट दिखाने के लिए किया जाता है. इसका इस्तेमाल, स्क्रीन के सबसे ऊपर या सबसे नीचे मौजूद छोटे हेडर टेक्स्ट स्ट्रिंग के लिए किया जाता है. जैसे, पुष्टि करने वाले ओवरले.
• ArcMedium का इस्तेमाल, आर्क हेडर और टाइटल के लिए किया जाता है. आर्क का इस्तेमाल, स्क्रीन पर घुमावदार पाथ के साथ टेक्स्ट के लिए किया जाता है. यह स्क्रीन के सबसे ऊपर या सबसे नीचे मौजूद छोटे हेडर टेक्स्ट स्ट्रिंग के लिए रिज़र्व होता है. जैसे, पेज के टाइटल.
• ArcSmall का इस्तेमाल, टेक्स्ट की छोटी आर्क स्ट्रिंग के लिए किया जाता है. आर्क का इस्तेमाल, स्क्रीन पर घुमावदार पाथ के साथ टेक्स्ट दिखाने के लिए किया जाता है. इसका इस्तेमाल, स्क्रीन पर सबसे नीचे घुमावदार टेक्स्ट स्ट्रिंग दिखाने के लिए किया जाता है. जैसे, कॉल टू ऐक्शन.